远近高低各不同
远近高低各不同

JS之放大镜案例

让我为大家带来一个关于放大镜的实现方法吧！

DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>title>
	<style>
		* {
			margin: 0;
			padding: 0;
		}
		.box {
			margin: 150px;
			overflow: hidden;
		}
		.big {
			display: none;
			width: 400px;
			height: 400px;
			margin-left: 10px;
			overflow: hidden;
			position: relative;
		}
		.small {
			width: 400px;
			height: 400px;
			float: left;
			position: relative;
		}
		.shadow {
			display: none;
			position: absolute;
			top: 0;
			left: 0;
			width: 200px;
			height: 200px;
			background-color: #fff;
			opacity: 0.5;
		}

		.big img {
			position: absolute;
			left: 0;
			top: 0;
		}
	style>
head>

<body>
	
	<div class="box">
		
		<div class="small">
			
			<img style="width: 400px; height: 400px;" src="1.jpg" alt="">
			
			<span class="shadow">span>
		div>
		
		<div class="big">
			
			<img style="width: 800px; height: 800px;" src="2.jpg" alt="">
		div>
	div>
body>
<script>
	//获取box
	var box = document.querySelector(".box")
	//获取小图片盒子
	var small = document.querySelector(".small")
	//获取阴影
	var shadow = document.querySelector(".shadow")
	// console.log(shadow);
	//获取大图片盒子
	var big = document.querySelector(".big")
	//获取图片
	var img = document.querySelector(".big img")
	//给小图片盒子设置移入事件
	small.onmouseover = function () {
		//移入阴影盒子显示
		shadow.style.display = "block"
		//移入大图片盒子显示
		big.style.display = "block"
	}
	//小盒子移出事件
	small.onmouseout = function () {
		//移出阴影盒子隐藏
		shadow.style.display = "none"
		//移出大盒子隐藏
		big.style.display = "none"
	}
	//小盒子鼠标移动事件
	small.onmousemove = function (e) {
		//鼠标的距离 - 盒子距离浏览器的距离 - 盒子自身一半的距离 = 向左或者向上距离阴影盒子的距离
		var x = e.clientX - box.offsetLeft - shadow.offsetWidth / 2
		var y = e.clientY - box.offsetTop - shadow.offsetHeight / 2
		if (x < 0) {
			x = 0
		} else if (x > small.offsetWidth - shadow.offsetWidth) {
			x = small.offsetWidth - shadow.offsetWidth
		}
		if (y < 0) {
			y = 0
		} else if (y > small.offsetHeight - shadow.offsetHeight) {
			y = small.offsetHeight - shadow.offsetHeight
		}
		shadow.style.left = x + "px"
		shadow.style.top = y + "px"
		//因为图片是从右向左移,所以要是-的x和y,大图片比小的大2倍,乘于2
		img.style.left = -x * 2 + "px"
		img.style.top = -y * 2 + "px"
	}
script>
html>

感谢大家的阅读，如有不对的地方，可以向我提出，感谢大家！

你可能感兴趣的:(javascript,前端,css)

  • 2019-05-29 vue-router的两种模式的区别 Kason晨
    1、大家都知道vue是一种单页应用,单页应用就是仅在页面初始化的时候加载相应的html/css/js一单页面加载完成,不会因为用户的操作而进行页面的重新加载或者跳转,用javascript动态的变化html的内容优点:良好的交互体验,用户不需要刷新页面,页面显示流畅,良好的前后端工作分离模式,减轻服务器压力,缺点:不利于SEO,初次加载耗时比较多2、hash模式vue-router默认的是hash
  • 系列3：【深入】qiankun动态与按需加载子应用—像电影一样控制出现时机 rabbit_it qiankun学习前端框架前端阿里云
    一、引言：为何需要动态加载在现代前端开发中，性能优化始终是一个关键问题。对于微前端架构而言，管理多个子应用带来了前所未有的灵活性，但也对资源的加载和使用效率提出了更高要求。假设你的微前端项目就像一场电影，而子应用是场景或演员。在不同的情节中，我们只需要特定的场景和演员出现，而不需要所有场景和演员一开始就站在舞台上等待。这时，动态加载和按需加载就成为了关键工具——让需要的内容在正确的时机上场，节省性
  • ODOO不同版本与平台选择 chouchengyin2080 c#操作系统运维
    1.10.0vs11.0vs8.0截至2017年底，最新的ODOO发布版为ODOO11.0，但功能上有一定精简（去除财务模块，去除工作流支持），技术上变动较大（代码逐步迁移至Python3，前端框架改写得抽象）。所以如果是从生产使用的角度来讲，ODOO10.0是当前最好选择，因为其更稳定，第三方模块也更多更全面。而如果是ODOO技术爱好从业者，则逐步迁移至ODOO11.0也有必要，因为其底层技术架
  • 清除 Conda 缓存 Dmatteratall conda缓存
    清除Conda缓存：cssCopycodecondaclean--allcondaclean--all命令将会清除Conda缓存和临时文件，而不会删除已经安装的软件包和环境。它主要用于清理不必要的缓存和临时文件以释放磁盘空间。
  • Nuxt Kit 自动导入功能：高效管理你的模块和组合式函数 qcidyu 好用的工具集合代码效率前端技巧Vue开发组合式函数模块管理自动导入NuxtKit
    title:NuxtKit自动导入功能：高效管理你的模块和组合式函数date:2024/9/14updated:2024/9/14author:cmdragonexcerpt:通过使用NuxtKit的自动导入功能，您可以更高效地管理和使用公共函数、组合式函数和VueAPI。无论是单个导入、目录导入还是从第三方模块导入，您都可以通过简单的API调用轻松实现。categories:前端开发tags:N
  • electron多标签页模式更像客户端 diygwcom electronjavascript前端
    Electron多标签页模式是指在Electron框架中实现的类似Web浏览器的多标签页功能。Electron是一个使用Web技术（HTML、CSS和JavaScript）来创建跨平台桌面应用程序的框架。在Electron中实现多标签页模式，通常需要借助一些特定的库或组件，如BrowserView或electron-tabs，或者通过自定义实现。实现方式1.使用BrowserViewBrowser
  • 外卖霸王餐返利外卖会员卡小程序开发 闹小艾 good506070微信小程序小程序
    外卖霸王餐返利外卖会员卡小程序开发"社交电商赋能下的外卖返利小程序"是专为商家与用户双赢而设计的创新平台。以下是其开发方案的详细步骤：一、需求梳理：首先，我们需要明确小程序的核心功能和特色。包括设定活动类型、返利策略，以及用户体验友好的界面设计。二、技术决策：技术选型是关键。我们采用小程序的开发框架，利用JavaScript作为前端开发语言，并结合微信提供的API进行后端接口调用与数据处理。三、账
  • Axure设计之全屏与退出全屏交互实现 招风的黑耳 Axureaxure交互
    在AxureRP中，设计全屏与退出全屏的交互功能可以极大地提升用户体验，尤其是在展示产品原型或进行演示时。本文将详细介绍如何在AxureRP中通过结合JavaScript代码实现全屏与退出全屏的交互效果。Axure原型设计web端交互元件库：https://1zvcwx.axshare.com一、设计思路全屏与退出全屏的交互设计主要依赖于JavaScript代码来控制浏览器的全屏模式。在Axure
  • 终于搞懂TS中的泛型啦! | typescript 入门指南 04 程序员王天 TypeScript实践指南前端javascripttypescript
    大家好，我是王天~今天分享的是《ts入门指南》系列中第四篇，主要讲解ts中的泛型应用泛型在ts中是比较重要的概念，我花挺长时间才搞明白，整理输出这篇文章，希望能帮助到大家~《ts入门指南》系列，点击下方蓝色字体即可访问TsvsJs谁适合前端开发？|TypeScript入门指南01详解tsconfig.json配置文件|TypeScript入门指南02必学！TypeScript语法类型基础|Type
  • 前端HTML+CSS+JS的入门学习 俊昭喜喜里 前端htmlcss
    一.HTMLHTML（HyperTextMarkupLanguage）即超文本标记语言，是用于创建网页和网页应用程序的标准标记语言。它不是一种编程语言，而是一种标记语言，通过一系列的元素（elements）来告诉浏览器如何显示网页上的内容，如文本、图片、链接、表格、列表等。HTML文档由一系列的标签（tags）组成，这些标签告诉浏览器如何显示内容。标签通常成对出现，例如和，其中是开始标签，表示一个
  • 全面指南：用户行为从前端数据采集到实时处理的最佳实践 数字沉思 营销流量运营系统架构前端内容运营大数据
    引言在当今的数据驱动世界，实时数据采集和处理已经成为企业做出及时决策的重要手段。本文将详细介绍如何通过前端JavaScript代码采集用户行为数据、利用API和Kafka进行数据传输、通过Flink实时处理数据的完整流程。无论你是想提升产品体验还是做用户行为分析，这篇文章都将为你提供全面的解决方案。设计一个通用的ClickHouse表来存储用户事件时，需要考虑多种因素，包括事件类型、时间戳、用户信
  • EcmaScript和JavaScript的区别 每天吃八顿 前端ecmascript
    ECMAScript和JavaScript是经常被混淆的两个术语，但实际上它们之间存在一些区别：ECMAScript：ECMAScript（通常缩写为ES，并且有版本号如ES5,ES6和ES7等）是由ECMA国际（EuropeanComputerManufacturersAssociation）制定的一种脚本语言的规范。这个规范定义了语法、命令、数据类型等基本元素。ECMAScript是一种规范，
  • 10/24 每周学习总结5 木木ainiks 1024程序员节
    1RecordingtheMoolympicsS#include#includeusingnamespacestd;typedeflonglongint_1;intn;structnode{int_1begin_b;int_1end_e;}a[300];boolcmp(nodea,nodeb){if(a.end_e==b.end_e)returna.begin_b>b.begin_b;return
  • javascript添加p元素，html添加文字，appendChild 游勇一 javascripthtml添加pappendChild
    javascript添加p元素，html添加文字，appendChild。网页添加p元素效果截图。个人签名：游志勇，预制板，南托岭预制场。文字展示#wordsadd{font-size:70px;word-break:break-all;}#wordsaddp{margin:002px0;padding:002px0;line-height:93%;}.btn_width{width:90px;}
  • CesiumJS+SuperMap3D.js混用实现可视域分析 S3M图层加载 裁剪区域绘制 SteveJi666 WebGLcesiumEarthSDKSuperMap3djavascript前端arcgis
    版本简介：cesium：1.99；Supermap3D：SuperMapiClientJavaScript11i(2023)；官方下载文档链家：SuperMap技术资源中心|为您提供全面的在线技术服务示例参考：support.supermap.com.cn:8090/webgl/Cesium/examples/webgl/examples.html#analysissupport.supermap
  • 前端使用react-intl-universal进行国际化 Stephy_Yy #调研reactjsjavascriptcss
    一、国际化/i18n目前国际化，就是开发者写对象，一个key关联若干语种的翻译。相比于浏览器自带的翻译功能，语义更加准确。“国际化”的简称：i18n（其来源是英文单词internationalization的首末字符i和n，18为中间的字符数）二、react项目国际化react-intl是业界最受欢迎的软件包之一：React-intl是雅虎的语言国际化开源项目FormatJS的一部分，通过其提供的
  • html打开本地excel文件夹,html使用excel表格数据库-html读取本地excel文件并展示 睿理
    html表格如何导入到excel中在vs里面用添加数据源就可以啊,再使用数据控件,就可以操作.添加数据源可以用odbc数据源,两种方式1,是在控制面板的管理工具里在ODBC里先设置好.2,是使用连接字符串.用vs的添加数据源向导做.html中有没有类似excel表格，可以填数的表格控件？首先html不能读取本地excel文件其次就算是javascript也是不允许的这是为了安全考虑如果前端脚本可以
  • 如何在 Python 中声明一个静态属性? 潮易 python开发语言
    在Python中，静态属性的定义和使用方式与JavaScript中的类似，主要是通过`@staticmethod`装饰器来实现。静态属性不需要实例化对象就可以访问，它们属于类本身。###如何声明一个静态属性：1.首先，需要在属性名前添加`@staticmethod`装饰器。2.接下来，定义一个普通方法，该方法的第一个参数通常为`cls`（用于表示类的引用）。###代码示例：```pythoncla
  • 数据格式：什么是JSON和XML isNotNullX jsonxml
    JSON和XML都是数据交换的一种格式，用于在不同的系统和应用程序之间传输和存储数据。本文将解释JSON和XML的基础内容，并探讨两者的不同。一·什么是JSON？1.JSON（JavaScriptObjectNotation）即JavaScript对象标记法：-JSON是一种轻量级的数据交换格式，易于人阅读和编写，同时也易于机器解析和生成。-JSON基于JavaScript的一个子集，但JSON是
  • Java在Controller生成Excel供前端直接下载 pengjunlee SpringBoot重点详解导出文件POIexcelController
    在许多企业办公系统中，经常会有用户要求，需要对数据进行统计并且可以直接下载Excel文件，这样子的话，既然客户提出了要求，我们就应该去满足吖，毕竟客户是上帝嘛，那么我们如何去实现呢？且看我为你一一道来。POI简介JakartaPOI是一套用于访问微软格式文档的JavaAPI。JakartaPOI有很多组件组成，其中有用于操作Excel格式文件的HSSF和用于操作Word的HWPF，在各种组件中目前
  • HTML5概述 WFIT~SKY Web前端html5前端html
    1.HTML概述1.1HTML定义HTML超文本标记语言，其中超文本是链接，标记也叫标签（即带尖括号的文本）。1.2HTML基本骨架HTML基本骨架是网页模板。网页的标题网页的内容html：整个网页head：网页头部，存放给浏览器看的代码，例如CSSbody：网页主体，存放给用户看的代码，例如文字、图片title：网页标题1.3HTML关系父子关系（嵌套）兄弟关系（并列）2.HTML开发环境2.1
  • 解决前端导出excel文件，打开为乱码 荔枝，你让我拿什么荔枝！ vue前端elementuivue.js
    前端开发中，导入和导出文件是比较常见的业务场景，常见的情况是：后端返回一个二进制的流文件，前端将其转化为excel文件即可。但是往往会出现转化后的excel文件内容位乱码的情况，本文中提供了两个解决方案：方案一：用户自定义上传方法添加附件添加附件代码解读：上述代码采用了element-ui的el-upload文件上传的组件。改组件有两种文件上传的方式：1.组件自带的上传方法，只需要给其设置acti
  • HighCharts图表自动化简介 知识的宝藏 Selenium高级篇Selenium图表自动化测试highcharts图表自动化Selenium图表自动化图表自动化测试highchartsSelenium
    什么是分析数据？在任何应用程序中捕获并以图形或图表形式显示的分析数据是任何产品或系统的关键部分，因为它提供了对实时数据的洞察。验证此类分析数据非常重要，因为不准确的数据可能会在报告中产生问题，并可能影响应用程序/系统的其他相关领域。什么是HighChart？Highcharts是一个用纯JavaScript编写的j基于SVG成图技术的图表库，提供了一种简单的方法来向您的网站或Web应用程序添加交互
  • CesiumJS+SuperMap3D.js混用实现通视分析 SteveJi666 WebGLcesiumEarthSDKSuperMap3djavascript前端arcgis
    版本简介：cesium：1.99；Supermap3D：SuperMapiClientJavaScript11i(2023)；官方下载文档链家：SuperMap技术资源中心|为您提供全面的在线技术服务示例参考：support.supermap.com.cn:8090/webgl/Cesium/examples/webgl/examples.html#analysissupport.supermap
  • 2022年技术胖私藏工具分享 300+编程实用工具 wudongyu
    2022年技术胖私藏工具分享300+编程实用工具Javascript工具Underscore.js一套完善的函数式编程的接口，更方便地在JavaScript中实现函数式编程https://underscorejs.org/fastclick用于消除物理点击和click移动浏览器上事件触发之间的300毫秒延迟https://github.com/ftlabs/fastclickLodash一致性、模
  • CSS中如何实现鼠标悬停效果？ 神明木佑 css前端
    在CSS中，您可以使用:hover伪类来实现鼠标悬停效果。:hover伪类会在用户将鼠标悬停在选择器所匹配的元素上时应用指定的样式。下面是一个简单的例子，展示了如何在鼠标悬停时改变文本颜色和背景颜色：MouseHoverExample.hover-effect{color:black;background-color:white;padding:10px;text-align:center;}.h
  • java ajax_Java Ajax入门 孤独患喆 javaajax
    接下来整理一下Ajax相关的内容，AJAX(asynchronousjsandxml)，即异步的JavaScript和xml，它的主要作用就是让页面不必等待服务器返回整个页面信息，而可以通过异步的方式给服务器发送数据和获取数据，对页面进行局部刷新，是一种提高用户体验的技术。同步和异步同步和异步的主要区别如下；(1)同步：一个响应结束后才能发送下一个请求，页面在请求期间不能做其他事情。(2)异步：不
  • JavaScript 基础 - 第15天 +码农快讯+ JavaScript学习笔记javascript前端开发语言
    文章目录JavaScript基础-第15天深浅拷贝浅拷贝深拷贝通过JSON序列化实现js库lodash实现深拷贝通过递归实现深拷贝异常处理throwtry...catchdebugger处理this改变thiscallapplybindthis指向性能优化防抖（debounce）手写防抖函数节流（throttle）手写节流函数JavaScript基础-第15天深浅拷贝浅拷贝浅拷贝：把对象拷贝给一个
  • JavaScript 基础 - 第13天 +码农快讯+ JavaScript学习笔记javascript开发语言ecmascript
    文章目录JavaScript基础-第13天深入对象创建对象三种方式构造函数new实例化过程实例成员&静态成员实例成员静态成员一切皆对象内置构造函数ObjectArrayStringNumberJavaScript基础-第13天了解面向对象编程的基础概念及构造函数的作用，体会JavaScript一切皆对象的语言特征，掌握常见的对象属性和方法的使用。深入对象内置构造函数综合案例深入对象了解面向对象的基
  • 【Java】如何将二进制转换成MultipartFile Mxin5 Javajava开发语言
    业务场景：前端发送请求到后端进行文件上传，后端接收文件并调用第三方接口进行文件处理，响应格式为二进制，然后我们需要将二进制进行转换为MultipartFile进行文件上传。如果你想要将File转换成MultipartFile，可以参考：【Java】如何将File转换成MultipartFile_javafile转multipartfile_MXin5的博客-CSDN博客1.传递二进制respons
  • 二分查找排序算法 周凡杨 java二分查找排序算法折半
    一：概念 二分查找又称 折半查找（ 折半搜索/ 二分搜索），优点是比较次数少，查找速度快，平均性能好；其缺点是要求待查表为有序表，且插入删除困难。因此，折半查找方法适用于不经常变动而 查找频繁的有序列表。首先，假设表中元素是按升序排列，将表中间位置记录的关键字与查找关键字比较，如果两者相等，则查找成功；否则利用中间位置记录将表 分成前、后两个子表，如果中间位置记录的关键字大于查找关键字，则进一步
  • java中的BigDecimal bijian1013 javaBigDecimal
            在项目开发过程中出现精度丢失问题，查资料用BigDecimal解决，并发现如下这篇BigDecimal的解决问题的思路和方法很值得学习，特转载。         原文地址：http://blog.csdn.net/ugg/article/de
  • Shell echo命令详解 daizj echoshell
    Shell echo命令 Shell 的 echo 指令与 PHP 的 echo 指令类似，都是用于字符串的输出。命令格式： echo string 您可以使用echo实现更复杂的输出格式控制。 1.显示普通字符串: echo "It is a test" 这里的双引号完全可以省略，以下命令与上面实例效果一致： echo Itis a test 2.显示转义
  • Oracle DBA 简单操作 周凡杨 oracle dba sql
    --执行次数多的SQL select sql_text,executions from (      select sql_text,executions from v$sqlarea order by executions desc      ) where rownum<81;  &nb
  • 画图重绘 朱辉辉33 游戏
      我第一次接触重绘是编写五子棋小游戏的时候，因为游戏里的棋盘是用线绘制的，而这些东西并不在系统自带的重绘里，所以在移动窗体时，棋盘并不会重绘出来。所以我们要重写系统的重绘方法。   在重写系统重绘方法时，我们要注意一定要调用父类的重绘方法，即加上super.paint(g)，因为如果不调用父类的重绘方式，重写后会把父类的重绘覆盖掉，而父类的重绘方法是绘制画布，这样就导致我们
  • 线程之初体验 西蜀石兰 线程
    一直觉得多线程是学Java的一个分水岭，懂多线程才算入门。 之前看《编程思想》的多线程章节，看的云里雾里，知道线程类有哪几个方法，却依旧不知道线程到底是什么？书上都写线程是进程的模块，共享线程的资源，可是这跟多线程编程有毛线的关系，呜呜。。。 线程其实也是用户自定义的任务，不要过多的强调线程的属性，而忽略了线程最基本的属性。 你可以在线程类的run()方法中定义自己的任务，就跟正常的Ja
  • linux集群互相免登陆配置 林鹤霄 linux
    配置ssh免登陆 1、生成秘钥和公钥    ssh-keygen -t rsa 2、提示让你输入，什么都不输，三次回车之后会在~下面的.ssh文件夹中多出两个文件id_rsa 和 id_rsa.pub    其中id_rsa为秘钥，id_rsa.pub为公钥，使用公钥加密的数据只有私钥才能对这些数据解密    c
  • mysql : Lock wait timeout exceeded; try restarting transaction aigo mysql
    原文：http://www.cnblogs.com/freeliver54/archive/2010/09/30/1839042.html   原因是你使用的InnoDB   表类型的时候, 默认参数:innodb_lock_wait_timeout设置锁等待的时间是50s, 因为有的锁等待超过了这个时间,所以抱错.   你可以把这个时间加长,或者优化存储
  • Socket编程 基本的聊天实现。 alleni123 socket
    public class Server { //用来存储所有连接上来的客户 private List<ServerThread> clients; public static void main(String[] args) { Server s = new Server(); s.startServer(9988); } publi
  • 多线程监听器事件模式(一个简单的例子) 百合不是茶 线程监听模式
        多线程的事件监听器模式   监听器时间模式经常与多线程使用,在多线程中如何知道我的线程正在执行那什么内容,可以通过时间监听器模式得到        创建多线程的事件监听器模式 思路:    1, 创建线程并启动,在创建线程的位置设置一个标记     2,创建队
  • spring InitializingBean接口 bijian1013 javaspring
    spring的事务的TransactionTemplate，其源码如下： public class TransactionTemplate extends DefaultTransactionDefinition implements TransactionOperations, InitializingBean{ ... } TransactionTemplate继承了DefaultT
  • Oracle中询表的权限被授予给了哪些用户 bijian1013 oracle数据库权限
            Oracle查询表将权限赋给了哪些用户的SQL，以备查用。 select t.table_name as "表名", t.grantee as "被授权的属组", t.owner as "对象所在的属组"
  • 【Struts2五】Struts2 参数传值 bit1129 struts2
    Struts2中参数传值的3种情况 1.请求参数绑定到Action的实例字段上 2.Action将值传递到转发的视图上 3.Action将值传递到重定向的视图上   一、请求参数绑定到Action的实例字段上以及Action将值传递到转发的视图上 Struts可以自动将请求URL中的请求参数或者表单提交的参数绑定到Action定义的实例字段上，绑定的规则使用ognl表达式语言
  • 【Kafka十四】关于auto.offset.reset[Q/A] bit1129 kafka
    I got serveral questions about  auto.offset.reset. This configuration parameter governs how  consumer read the message from  Kafka when  there is no initial offset in ZooKeeper or
  • nginx gzip压缩配置 ronin47 nginx gzip 压缩范例
    nginx gzip压缩配置 更多 0 nginx gzip 配置   随着nginx的发展，越来越多的网站使用nginx，因此nginx的优化变得越来越重要，今天我们来看看nginx的gzip压缩到底是怎么压缩的呢？ gzip(GNU-ZIP)是一种压缩技术。经过gzip压缩后页面大小可以变为原来的30%甚至更小，这样，用
  • java-13.输入一个单向链表，输出该链表中倒数第 k 个节点 bylijinnan java
    two cursors. Make the first cursor go K steps first. /* * 第 13 题：题目：输入一个单向链表，输出该链表中倒数第 k 个节点 */ public void displayKthItemsBackWard(ListNode head,int k){ ListNode p1=head,p2=head;
  • Spring源码学习-JdbcTemplate queryForObject bylijinnan javaspring
    JdbcTemplate中有两个可能会混淆的queryForObject方法： 1. Object queryForObject(String sql, Object[] args, Class requiredType) 2. Object queryForObject(String sql, Object[] args, RowMapper rowMapper) 第1个方法是只查
  • [冰川时代]在冰川时代,我们需要什么样的技术? comsci 技术
         看美国那边的气候情况....我有个感觉...是不是要进入小冰期了?      那么在小冰期里面...我们的户外活动肯定会出现很多问题...在室内呆着的情况会非常多...怎么在室内呆着而不发闷...怎么用最低的电力保证室内的温度.....这都需要技术手段...   &nb
  • js 获取浏览器型号 cuityang js浏览器
    根据浏览器获取iphone和apk的下载地址 <!DOCTYPE html> <html> <head>     <meta charset="utf-8" content="text/html"/>     <meta name=
  • C# socks5详解 转 dalan_123 socketC#
    http://www.cnblogs.com/zhujiechang/archive/2008/10/21/1316308.html  这里主要讲的是用.NET实现基于Socket5下面的代理协议进行客户端的通讯，Socket4的实现是类似的，注意的事，这里不是讲用C#实现一个代理服务器，因为实现一个代理服务器需要实现很多协议，头大，而且现在市面上有很多现成的代理服务器用，性能又好，
  • 运维 Centos问题汇总 dcj3sjt126com 云主机
    一、sh 脚本不执行的原因 sh脚本不执行的原因 只有2个 1.权限不够 2.sh脚本里路径没写完整。   二、解决You have new mail in /var/spool/mail/root 修改/usr/share/logwatch/default.conf/logwatch.conf配置文件 MailTo = MailFrom   三、查询连接数
  • Yii防注入攻击笔记 dcj3sjt126com sqlWEB安全yii
    网站表单有注入漏洞须对所有用户输入的内容进行个过滤和检查，可以使用正则表达式或者直接输入字符判断，大部分是只允许输入字母和数字的，其它字符度不允许；对于内容复杂表单的内容，应该对html和script的符号进行转义替换：尤其是<,>,',"",&这几个符号 这里有个转义对照表： http://blog.csdn.net/xinzhu1990/articl
  • MongoDB简介[一] eksliang mongodbMongoDB简介
    MongoDB简介 转载请出自出处：http://eksliang.iteye.com/blog/2173288 1.1易于使用        MongoDB是一个面向文档的数据库，而不是关系型数据库。与关系型数据库相比，面向文档的数据库不再有行的概念，取而代之的是更为灵活的“文档”模型。        另外，不
  • zookeeper windows 入门安装和测试 greemranqq zookeeper安装分布式
    一、序言       以下是我对zookeeper 的一些理解：      zookeeper 作为一个服务注册信息存储的管理工具，好吧，这样说得很抽象，我们举个“栗子”。       栗子1号：       假设我是一家KTV的老板，我同时拥有5家KTV，我肯定得时刻监视
  • Spring之使用事务缘由(2-注解实现) ihuning spring
      Spring事务注解实现   1. 依赖包：     1.1 spring包：           spring-beans-4.0.0.RELEASE.jar           spring-context-4.0.0.
  • iOS App Launch Option 啸笑天 option
    iOS 程序启动时总会调用application:didFinishLaunchingWithOptions:，其中第二个参数launchOptions为NSDictionary类型的对象，里面存储有此程序启动的原因。   launchOptions中的可能键值见UIApplication Class Reference的Launch Options Keys节 。 1、若用户直接
  • jdk与jre的区别（_） macroli javajvmjdk
    简单的说JDK是面向开发人员使用的SDK，它提供了Java的开发环境和运行环境。SDK是Software Development Kit 一般指软件开发包，可以包括函数库、编译程序等。  JDK就是Java Development Kit JRE是Java Runtime Enviroment是指Java的运行环境，是面向Java程序的使用者，而不是开发者。 如果安装了JDK，会发同你
  • Updates were rejected because the tip of your current branch is behind qiaolevip 学习永无止境每天进步一点点众观千象git
    $ git push joe prod-2295-1 To [email protected]:joe.le/dr-frontend.git ! [rejected] prod-2295-1 -> prod-2295-1 (non-fast-forward) error: failed to push some refs to '[email protected]
  • [一起学Hive]之十四-Hive的元数据表结构详解 superlxw1234 hivehive元数据结构
    关键字：Hive元数据、Hive元数据表结构   之前在 “[一起学Hive]之一–Hive概述，Hive是什么”中介绍过，Hive自己维护了一套元数据，用户通过HQL查询时候，Hive首先需要结合元数据，将HQL翻译成MapReduce去执行。 本文介绍一下Hive元数据中重要的一些表结构及用途，以Hive0.13为例。   文章最后面，会以一个示例来全面了解一下，
  • Spring 3.2.14，4.1.7，4.2.RC2发布 wiselyman Spring 3
      Spring 3.2.14、4.1.7及4.2.RC2于6月30日发布。   其中Spring 3.2.1是一个维护版本(维护周期到2016-12-31截止)，后续会继续根据需求和bug发布维护版本。此时，Spring官方强烈建议升级Spring框架至4.1.7 或者将要发布的4.2 。   其中Spring 4.1.7主要包含这些更新内容。
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他