heshuaicsdn
heshuaicsdn

原生js放大镜 原理 一看就懂 非常简单

首先你需要照一张清晰度较高的，比较大的图片

html布局：

复制过去就行了

<body style="height:2000px;">
<div class="wrap" id="wrap">
    <div id="small">
        <img src="img/1.jpg" alt="">
        <div id="move">div>
    div>
    <div id="big">
        <img src="img/1.jpg" alt="">
    div>
div>
body>

style样式代码：

复制过去就行了

*{
    margin:0;
    padding:0;
}
.wrap{
    width: 600px;
    height: 360px;
    margin:100px;
}
#small,#big{
    width: 298px;
    height: 358px;
    border:1px solid #ccc;
    float:left;
}
#small{
    text-align:center;
    position: relative;
}
#small img{
    width: 285px;
    height:346px;
    margin-top:6px;
}
#move{
    width: 150px;
    height: 150px;
    /*background:rgba(255,255,255,.5);*/
    background:#fff;
    opacity:.5;
    filter:alpha(opacity=50);
    position: absolute;
    top: 0;
    left: 0;
    cursor:move;
    display:none;
}
#big{
    position:relative;
    overflow:hidden;
    display:block;
}
#big img{
    position:absolute;
    top:0;
    left:0;
}

核心js代码：

//1.
var oWrap = document.getElementById('wrap');
var smallDiv = document.getElementById('small');
var move = document.getElementById('move');
var bigDiv = document.getElementById('big');

//2.
smallDiv.onmousemove = function(ev) {
    var oEvent = ev || event;
    var iScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
    var iScrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
    var disX = oEvent.clientX + iScrollLeft - move.offsetWidth / 2 - oWrap.offsetLeft;
    var disY = oEvent.clientY + iScrollTop - move.offsetHeight / 2 - oWrap.offsetTop;
//  console.log(oWrap.offsetLeft)
    if (disX < 0) {
        disX = 0;
    } else if (disX > smallDiv.offsetWidth - move.offsetWidth) {
        disX = smallDiv.offsetWidth - move.offsetWidth;
    };
    if (disY < 0) {
        disY = 0;
    } else if (disY > smallDiv.offsetHeight - move.offsetHeight) {
        disY = smallDiv.offsetHeight - move.offsetHeight;
    };
    move.style.left = disX + 'px';
    move.style.top = disY + 'px';
    /*算出move块在X轴的移动距离与总的移动距离的比例*/
    var _pageX = disX / (smallDiv.offsetWidth - move.offsetWidth);
        console.log(_pageX)   /*这是一个0~1之间的数*/
    /*算出move块在Y轴的移动距离与总的移动距离的比例*/
    var _pageY = disY / (smallDiv.offsetHeight - move.offsetHeight);
    /*求出大图片在X轴的移动距离*/
    var mX = _pageX * (bigDiv.children[0].offsetWidth - bigDiv.offsetWidth);
    /*求出大图片在Y轴的移动距离*/
    var mY = _pageY * (bigDiv.children[0].offsetHeight - bigDiv.offsetHeight);
    bigDiv.children[0].style.left = -mX + 'px';
    bigDiv.children[0].style.top = -mY + 'px';
};

//3.
smallDiv.onmouseover = function(ev) {
    bigDiv.style.display = 'block';
    move.style.display = 'block';
    smallDiv.onmousemove(); //兼容IE
};
smallDiv.onmouseout = function() {
    bigDiv.style.display = 'none';
    move.style.display = 'none';
};

你可能感兴趣的:(原生JS)

  • js原生给生成的html添加点击事件,原生js为动态元素添加监听事件 习翔宇
    //已存在div//创建标签functioncreatepage(){varspan=document.createElement('span')span.innerHTML=“测试span”//设置属性span.setAttribute("class","gopage");varpagenum=document.getElementById("pagenum")pagenum.appendChi
  • mybatis支持json，Spring boot配置 Knight_9
    mysql5.7版本以后支持原生json格式，基于Springboot进行配置说明。mybatis支持mysql的json格式mysql-connector，mysql的驱动版本要大于等于5.1.40，否则json字段查询会发生乱码。继承BaseTypeHandler自定义一个json类型处理器，放到一个handler包下，例：packagecom.c.config.handler;importc
  • 随笔记录git提交出错和原生js以JSON格式请求接口导出Excel 山丘lemon
    GIT提交代码出错Fileexists.原文链接https://www.cnblogs.com/sweetbullet/p/9889997.html前端js导出,参数以json格式发送post请求原文链接https://www.cnblogs.com/sweetbullet/p/9843178.html
  • jQuery高级技巧——性能优化篇 mqy1023 Jqueryjquery
    阅读目录通过CDN（ContentDeliveryNetwork）引入jQuery库减少DOM操作适当使用原生JS选择器优化缓存jQuery对象定义一个可以复用的函数用数组方式来遍历jQuery对象集合通过CDN（ContentDeliveryNetwork）引入jQuery库要提升网站中javascript的性能的最简单的一步就是引入最新版本的jQuery库，新发布的版本通常在性能上会有更好的提
  • 使用vue+原生js编写时间轴--cesium三维球 我爱吃干果 JavaScriptjavascriptvue.js前端html5csstypescript
    突然感觉自己是天生的牛马了，今天同事接到个需求，要写一个关于气象的插件，其他的功能还好说，但是这个时间轴的功能，网上的插件貌似比较少，自己手搓呢，他又不想这么麻烦。然后我看到这个功能感觉觉得挺考验技术的，顿时心里就特别痒痒。哈哈，看我贱不贱。随后我利用周末的时间就手搓了一个时间轴。本来想用canvas来绘制来着，后来想到用canvas绘制的图形性能方面也许会好很多，但是想修改样式缺很不容易。并且我
  • 03.React学习日记.JSX绑定事件-传递参数 _生生不息_
    1.原生js事件获取image.png2.组件中方法事件获取发生该事件后，React内部回调函数，会自动传入一个event对象。注意：这两者不是同一种类型的对象，前者为js原生事件对象，后者为React内部合成的事件对象，功能属性基本一样。推荐：箭头函数是最方便的方法：image.pngiage.png注意：事件发生时，React内部调用函数，执行函数onClick.call(undefined,
  • 百度地图的使用(js，vue2，vue3) Nancy哇 地图百度javascript开发语言vue前端cssvue.js
    百度地图的使用创建应用获取密钥akak是在百度地图开发者平台申请的密钥详见http://lbsyun.baidu.com/apiconsole/key一、原生js使用百度地图引入初始化地图varmap=newBMapGL.Map("container");//创建地图实例varpoint=newBMapGL.Point(116.404,39.928);//创建点坐标map.centerAndZoo
  • 前端js控制点击切换效果且刷新浏览器不会重置 spring39 前端javascript
    提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、布局的部分代码和样式二、使用js来控制点击时颜色变化，点击哪一个图标，哪一个图标就应该变橙色且带有下边框1.分析流程及思路2.为什么要有刷新浏览器闪亮图标不变的需求？3.依靠sessionStroage的浏览器未关闭，不会消失的特性来存储相关数据4.整体实现前言原生js实现点击切换样式效果，且刷新浏览器不会丢失当前数据
  • 用原生js实现数组扁平化 拙慕JULY 前端javascript原生js
    数组扁平化：[1,3,[5,2],[2,3,[4,5]]]------->[1,3,5,2,2,3,4,5]/实现一：递归/functionflatArray(arr){varresult=[];for(vari=0;i+item);//returnarr.join(',').split(',').map(item=>+item);}/实现三：使用ES6新增的扩展运算符//*console.log
  • 利用原生js实现简易照片墙 魅美 笔记javascriptcsshtml
    效果演示基本布局css样式*{margin:0;padding:0;}html,body,ul{width:100%;height:100%;}#pic{position:relative;list-style:none;}#picli{position:absolute;width:180px;height:250px;box-shadow:0010px#000;transition:all1s
  • Servlet学习(一)：jquary和json 青城小虫 servlet学习json
    一、jquary的学习和使用1.什么是jquaryjQuery是一个JavaScript库。jQuery极大地简化了JavaScript编程。jQuery很容易学习。2.jquary和原生js对比获取input框中的数据和div框中的数据Inserttitlehere用户名:密码:div1div2functiongetInput(){varusername=$("#userName").val()
  • JS特效第144弹：audio古典的胶片音乐播放器代码 马coder javascript开发语言ecmascript
    原生js基于audio属性制作简单的圆形胶片转动音乐播放器。这是一款古典唯美风格的胶片音乐播放代码，支持暂停，开始播放效果，先来看看效果：一部分关键的代码如下：全部代码：audio古典的胶片音乐播放器代码
  • 前端程序员面试你应该懂的原生JS——2 易懂程序猿
    1.谈谈你对JS执行上下文栈和作用域链的理解。执行上下文就是当前JavaScript代码被解析和执行时所在环境,JS执行上下文栈可以认为是一个存储函数调用的栈结构，遵循先进后出的原则。1.JavaScript执行在单线程上，所有的代码都是排队执行。2.一开始浏览器执行全局的代码时，首先创建全局的执行上下文，压入执行栈的顶部。3.每当进入一个函数的执行就会创建函数的执行上下文，并且把它压入执行栈的顶
  • jQuery之for循环 九月萩
    1.for循环（原生JS）for(vari=0;i
  • 使用原生JS求一段字符串出现最多的次数和最少的次数，最大值和最小值(JS常见面试题) Altynai　 web前端JavascriptJavascript面试题原生JS
    直接看代码(一把梭也可以):letstrings='aqqwwqqaaasddvvccxxxx..........'letobj={};for(leti=0;imax){//求最大值，使用打擂台的思想max=arr[i]}if(arr[i]
  • 原生js实现拖动滑块验证 jane819
    原生js实现拖动滑块验证#box{width:150px;height:20px;position:relative;background:#ccc;}#box.btn{width:20px;height:20px;box-sizing:border-box;border:1pxsolid#eee;text-align:center;line-height:20px;position:absolu
  • 分享76个时间日期JS特效，总有一款适合您 自动化新人 javascript前端
    分享76个时间日期JS特效，总有一款适合您76个时间日期JS特效下载链接：https://pan.baidu.com/s/1s7tPGT_ItK7dNK5_qbZkug?pwd=8888提取码：8888Python采集代码下载链接：采集代码.zip-蓝奏云学习知识费力气，收集整理更不易。知识付费甚欢喜，为咱码农谋福利。简易的中性时钟特效翻页倒计时ui特效逼真的卡西欧手表图形特效原生js图片滚动时钟
  • 分享76个时间日期JS特效，总有一款适合您 记忆的小河 javascript前端
    分享76个时间日期JS特效，总有一款适合您76个时间日期JS特效下载链接：https://pan.baidu.com/s/1s7tPGT_ItK7dNK5_qbZkug?pwd=8888提取码：8888Python采集代码下载链接：采集代码.zip-蓝奏云学习知识费力气，收集整理更不易。知识付费甚欢喜，为咱码农谋福利。简易的中性时钟特效翻页倒计时ui特效逼真的卡西欧手表图形特效原生js图片滚动时钟
  • 原生JS中DOM元素的操作 阿克兰
    获取domdocument.getElementsByClassName(“class”);document.getElementById(“id”)document.getElementsByName("name");document.getElementsByTagName(“TagName”);ocument.querySelector(".btnlist");document.queryS
  • 小兔鲜项目-原生JS实现页面登录模块 东方青云、 综合案例JS笔记javascript前端htmlcss
    目录1.项目搭建1.1在项目开始之前，先做好准备工作，创建这样的文件目录1.1.1css文件夹1.1.2images文件1.1.3uploads文件1.2HTML结构1.2.1头部结构1.2.2主体结构1.2.3login.html代码示例：1.3css样式1.3.1页面初始化（base)样式1.3.2公共样式（common)样式1.3.3首页样式（login)样式2、JavaScript源码2.
  • js实现深拷贝的5种方式 Cupid510 javaScript
    实现深拷贝的方式JSON方法实现//_tmp和result是相互独立的，没有任何联系，有各自的存储空间。letdeepClone=function(obj){let_tmp=JSON.stringify(obj);//将对象转换为json字符串形式letresult=JSON.parse(_tmp);//将转换而来的字符串转换为原生js对象returnresult;};letobj1={weiqi
  • vue项目拆分组件思想对比 煸橙干儿~~ VUE实战vue.js前端javascript
    基于组件拆分：优点：组件增加复用，增加可维护性拆分：.vue=HTML+JS+CSS问题：一旦组件从一个变成了多个，必定形成嵌套关系，从而增加通信成本基于逻辑拆分：优点：逻辑的复用，增加可维护性拆分：拆分的只有js问题：对原生js函数的理解要求高了基于逻辑的通用拆分思想：1、找到组件中属于同一个业务逻辑的所有代码（响应式数据+修改数据的方法）2、定义一个以use打头的方法，把第一步所有的业务逻辑代
  • 原生js实现按钮复制功能 （附doucment指令大全） 听说名字长键盘敲得更响 javascript开发语言html5前端
    话不多说，直接上代码复制letinput=document.getElementById('input');letcopy=document.getElementById('copy');copy.addEventListener('click',function(){console.log(input.value);input.select();//选中需复制的内容//原生指令document.
  • 原生JS使用PrintJs进行表格打印 -- 遇到的问题总结 ᥬ 小月亮 JSjavascript开发语言ecmascript
    需求1：表格自动分页之后，表头在每一页都需要显示html中表头增加thead标签css样式新增：thead{display:table-header-group;/*这个属性使thead总是在新的page-break之后重新开始*/}需求2：表格自动分页之后，页头需要在每一页都显示因为表头能重复显示，所以我是直接将需要重复的页头也放在表头中，然后给一个高度进行样式的调整。不论是多表头还是只有一个表
  • 前端html基础（包括dom，事件等） jack_rofer
    六。事件操作1.事件参考2.DOM的操作方法3.原生JS获取HTMLDOM元素的8种方法4.Javascript中的事件冒泡与事件捕获5.JS阻止冒泡和取消默认事件(默认行为)
  • Vue:vue中的指令（属性绑定指令、事件绑定指令、修饰符、双向绑定指令...） 奄奄一息的一条咸鱼 Vuejavascriptajax前端vue
    内容指令v-text指令：v-text和原生js中的innerText差不多，都无法解析标签，会把标签当做文本输出，在vue中使用v-text指令会覆盖标签原来的内容代码示范：#最后输出结果为HelloVue~~会被覆盖掉Vue~~exportdefault{data(){return{msg:'Hello'}}}v-html指令v-html和原生js中的innerHTML差不多，都可以解析标签，
  • 2018前端常见基础面试题（精炼版） 上天眷顾我 JavaScript面试集
    本章内容都是作者手动整理并且尽量缩减内容，目的就是可以让开发者短时间内回顾知识碎片和面试问题。常规1.js如何查找元素以及他们的区别document.querySelector('#id');//静态获取节点（js新增的节点无法获取）document.getElementById('#Id');//性能更快更高效，动态获取节点$('#id');//使用了第一种原生js封装而成的2.html新特性①
  • JavaScript学习笔记（二十七）-- ajax及ajax封装 千锋HTML5学院
    AJAXajax全名asyncjavascriptandXML是前后台交互的能力也就是我们客户端给服务端发送消息的工具，以及接受响应的工具是一个默认异步执行机制的功能AJAX的优势不需要插件的支持，原生js就可以使用用户体验好（不需要刷新页面就可以更新数据）减轻服务端和带宽的负担缺点：搜索引擎的支持度不够，因为数据都不在页面上，搜索引擎搜索不到AJAX的使用在js中有内置的构造函数来创建ajax对
  • 原生js-Ajax封装 学而时习之不亦说乎。 jsajaxjavascript服务器
    Ajax说道ajax到底什么是ajax？ajax是一种创建交互网页应用的一门技术。ajax的应用场景有：（地图）实时更新，表单验证等等....ajax的优缺点：优点：1.实现局部更新（无刷新状态下），2.减轻了服务器端的压力缺点：1.破坏了浏览器前进和后退机制（因为ajax自动更新机制）2.一个Ajax请求多了，也会出现页面加载慢的情况。3.搜索引擎的支持程度比较低。4.ajax的安全性问题不太好
  • HTML5原生的Drag和Drop,H5原生拖放(Drag and Drop)demo以及浏览器兼容性处理 晴-LQ
    H5原生拖放(DragandDrop)demo以及浏览器兼容性处理这篇文章发布于2020/08/22，归类于JavaScript标签：js拖拽，原生js拖放，js拖放，js拖放浏览器兼容性，HTML5拖放，dragstart，drop一般在网页中，如果需要实现拖放，首先要有两个元素可拖动的元素，元素draggable="true"属性就是可拖放，如果设置为false就是不可拖放可以放置的区域，注意
  • windows下源码安装golang 616050468 golang安装golang环境windows
             系统： 64位win7， 开发环境：sublime text 2，  go版本： 1.4.1    1.  安装前准备(gcc, gdb, git)        golang在64位系
  • redis批量删除带空格的key bylijinnan redis
    redis批量删除的通常做法： redis-cli keys "blacklist*" | xargs redis-cli del 上面的命令在key的前后没有空格时是可以的，但有空格就不行了： $redis-cli keys "blacklist*" 1) "blacklist:12: [email protected]
  • oracle正则表达式的用法 0624chenhong oracle正则表达式
      方括号表达示 方括号表达式 描述 [[:alnum:]] 字母和数字混合的字符 [[:alpha:]] 字母字符 [[:cntrl:]] 控制字符 [[:digit:]] 数字字符 [[:graph:]] 图像字符 [[:lower:]] 小写字母字符 [[:print:]] 打印字符 [[:punct：]] 标点符号字符 [[:space:]]
  • 2048源码(核心算法有，缺少几个anctionbar，以后补上) 不懂事的小屁孩 2048
    2048游戏基本上有四部分组成， 1：主activity，包含游戏块的16个方格，上面统计分数的模块 2：底下的gridview，监听上下左右的滑动，进行事件处理， 3：每一个卡片，里面的内容很简单，只有一个text，记录显示的数字 4：Actionbar，是游戏用重新开始，设置等功能(这个在底下可以下载的代码里面还没有实现) 写代码的流程 1：设计游戏的布局，基本是两块，上面是分
  • jquery内部链式调用机理 换个号韩国红果果 JavaScriptjquery
    只需要在调用该对象合适(比如下列的setStyles)的方法后让该方法返回该对象（通过this  因为一旦一个函数称为一个对象方法的话那么在这个方法内部this（结合下面的setStyles）指向这个对象） function create(type){ var element=document.createElement(type); //this=element;
  • 你订酒店时的每一次点击 背后都是NoSQL和云计算 蓝儿唯美 NoSQL
    全球最大的在线旅游公司Expedia旗下的酒店预订公司，它运营着89个网站，跨越68个国家，三年前开始实验公有云，以求让客户在预订网站上查询假期酒店时得到更快的信息获取体验。 云端本身是用于驱动网站的部分小功能的，如搜索框的自动推荐功能，还能保证处理Hotels.com服务的季节性需求高峰整体储能。 Hotels.com的首席技术官Thierry Bedos上个月在伦敦参加“2015 Clou
  • java笔记1 a-john java
    1，面向对象程序设计（Object-oriented Propramming，OOP）：java就是一种面向对象程序设计。 2，对象：我们将问题空间中的元素及其在解空间中的表示称为“对象”。简单来说，对象是某个类型的实例。比如狗是一个类型，哈士奇可以是狗的一个实例，也就是对象。 3，面向对象程序设计方式的特性：     3.1 万物皆为对象。    
  • C语言 sizeof和strlen之间的那些事 C/C++软件开发求职面试题 必备考点（一） aijuans C/C++求职面试必备考点
            找工作在即，以后决定每天至少写一个知识点，主要是记录，逼迫自己动手、总结加深印象。当然如果能有一言半语让他人收益，后学幸运之至也。如有错误，还希望大家帮忙指出来。感激不尽。        后学保证每个写出来的结果都是自己在电脑上亲自跑过的，咱人笨，以前学的也半吊子。很多时候只能靠运行出来的结果再反过来
  • 程序员写代码时就不要管需求了吗？ asia007 程序员不能一味跟需求走
          编程也有2年了，刚开始不懂的什么都跟需求走，需求是怎样就用代码实现就行，也不管这个需求是否合理，是否为较好的用户体验。当然刚开始编程都会这样，但是如果有了2年以上的工作经验的程序员只知道一味写代码，而不在写的过程中思考一下这个需求是否合理，那么，我想这个程序员就只能一辈写敲敲代码了。       我的技术不是很好，但是就不代
  • Activity的四种启动模式 百合不是茶 android栈模式启动Activity的标准模式启动栈顶模式启动单例模式启动
    android界面的操作就是很多个activity之间的切换,启动模式决定启动的activity的生命周期 ;   启动模式xml中配置     <activity android:name=".MainActivity" android:launchMode="standard&quo
  • Spring中@Autowired标签与@Resource标签的区别 bijian1013 javaspring@Resource@Autowired@Qualifier
    Spring不但支持自己定义的@Autowired注解，还支持由JSR-250规范定义的几个注解，如：@Resource、 @PostConstruct及@PreDestroy。   1. @Autowired    @Autowired是Spring 提供的，需导入    Package:org.springframewo
  • Changes Between SOAP 1.1 and SOAP 1.2 sunjing ChangesEnableSOAP 1.1SOAP 1.2
    JAX-WS SOAP Version 1.2 Part 0: Primer (Second Edition) SOAP Version 1.2 Part 1: Messaging Framework (Second Edition) SOAP Version 1.2 Part 2: Adjuncts (Second Edition)   Which style of WSDL
  • 【Hadoop二】Hadoop常用命令 bit1129 hadoop
    以Hadoop运行Hadoop自带的wordcount为例，   hadoop脚本位于/home/hadoop/hadoop-2.5.2/bin/hadoop，需要说明的是，这些命令的使用必须在Hadoop已经运行的情况下才能执行   Hadoop HDFS相关命令  hadoop fs -ls  列出HDFS文件系统的第一级文件和第一级
  • java异常处理（初级） 白糖_ javaDAOspring虚拟机Ajax
    从学习到现在从事java开发一年多了，个人觉得对java只了解皮毛，很多东西都是用到再去慢慢学习，编程真的是一项艺术，要完成一段好的代码，需要懂得很多。 最近项目经理让我负责一个组件开发，框架都由自己搭建，最让我头疼的是异常处理，我看了一些网上的源码，发现他们对异常的处理不是很重视，研究了很久都没有找到很好的解决方案。后来有幸看到一个200W美元的项目部分源码，通过他们对异常处理的解决方案，我终
  • 记录整理-工作问题 braveCS 工作
    1）那位同学还是CSV文件默认Excel打开看不到全部结果。以为是没写进去。同学甲说文件应该不分大小。后来log一下原来是有写进去。只是Excel有行数限制。那位同学进步好快啊。 2）今天同学说写文件的时候提示jvm的内存溢出。我马上反应说那就改一下jvm的内存大小。同学说改用分批处理了。果然想问题还是有局限性。改jvm内存大小只能暂时地解决问题，以后要是写更大的文件还是得改内存。想问题要长远啊
  • org.apache.tools.zip实现文件的压缩和解压，支持中文 bylijinnan apache
    刚开始用java.util.Zip，发现不支持中文（网上有修改的方法，但比较麻烦） 后改用org.apache.tools.zip org.apache.tools.zip的使用网上有更简单的例子 下面的程序根据实际需求，实现了压缩指定目录下指定文件的方法 import java.io.BufferedReader; import java.io.BufferedWrit
  • 读书笔记-4 chengxuyuancsdn 读书笔记
    1、JSTL 核心标签库标签 2、避免SQL注入 3、字符串逆转方法 4、字符串比较compareTo 5、字符串替换replace 6、分拆字符串 1、JSTL 核心标签库标签共有13个， 学习资料：http://www.cnblogs.com/lihuiyy/archive/2012/02/24/2366806.html 功能上分为4类： (1)表达式控制标签：out
  • [物理与电子]半导体教材的一个小问题 comsci 问题
          各种模拟电子和数字电子教材中都有这个词汇-空穴       书中对这个词汇的解释是; 当电子脱离共价键的束缚成为自由电子之后,共价键中就留下一个空位,这个空位叫做空穴       我现在回过头翻大学时候的教材,觉得这个
  • Flashback Database --闪回数据库 daizj oracle闪回数据库
    Flashback 技术是以Undo segment中的内容为基础的， 因此受限于UNDO_RETENTON参数。要使用flashback 的特性，必须启用自动撤销管理表空间。 在Oracle 10g中， Flash back家族分为以下成员： Flashback Database， Flashback Drop，Flashback Query(分Flashback Query,Flashbac
  • 简单排序:插入排序 dieslrae 插入排序
    public void insertSort(int[] array){ int temp; for(int i=1;i<array.length;i++){ temp = array[i]; for(int k=i-1;k>=0;k--)
  • C语言学习六指针小示例、一维数组名含义，定义一个函数输出数组的内容 dcj3sjt126com c
    # include <stdio.h> int main(void) { int * p; //等价于 int *p 也等价于 int* p; int i = 5; char ch = 'A'; //p = 5; //error //p = &ch; //error //p = ch; //error p = &i; //
  • centos下php redis扩展的安装配置3种方法 dcj3sjt126com redis
    方法一 1.下载php redis扩展包  代码如下 复制代码 #wget http://redis.googlecode.com/files/redis-2.4.4.tar.gz 2 tar -zxvf 解压压缩包，cd /扩展包 （进入扩展包然后 运行phpize 一下是我环境中phpize的目录，/usr/local/php/bin/phpize (一定要
  • 线程池(Executors) shuizhaosi888 线程池
    在java类库中，任务执行的主要抽象不是Thread，而是Executor，将任务的提交过程和执行过程解耦 public interface Executor { void execute(Runnable command); }   public class RunMain implements Executor{ @Override pub
  • openstack 快速安装笔记 haoningabc openstack
    前提是要配置好yum源 版本icehouse，操作系统redhat6.5 最简化安装，不要cinder和swift 三个节点 172 control节点keystone glance horizon 173 compute节点nova 173 network节点neutron control /etc/sysctl.conf net.ipv4.ip_forward =
  • 从c面向对象的实现理解c++的对象（二） jimmee C++面向对象虚函数
    1. 类就可以看作一个struct，类的方法，可以理解为通过函数指针的方式实现的，类对象分配内存时，只分配成员变量的，函数指针并不需要分配额外的内存保存地址。 2. c++中类的构造函数，就是进行内存分配(malloc)，调用构造函数 3. c++中类的析构函数，就时回收内存(free) 4. c++是基于栈和全局数据分配内存的，如果是一个方法内创建的对象，就直接在栈上分配内存了。 专门在
  • 如何让那个一个div可以拖动 lingfeng520240 html
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml
  • 第10章 高级事件（中） onestopweb 事件
    index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
  • 计算两个经纬度之间的距离 roadrunners 计算纬度LBS经度距离
    要解决这个问题的时候，到网上查了很多方案，最后计算出来的都与百度计算出来的有出入。下面这个公式计算出来的距离和百度计算出来的距离是一致的。 /** * * @param longitudeA * 经度A点 * @param latitudeA * 纬度A点 * @param longitudeB *
  • 最具争议的10个Java话题 tomcat_oracle java
    1、Java8已经到来。什么！？ Java8 支持lambda。哇哦，RIP Scala！ 　　随着Java8 的发布，出现很多关于新发布的Java8是否有潜力干掉Scala的争论，最终的结论是远远没有那么简单。Java8可能已经在Scala的lambda的包围中突围，但Java并非是函数式编程王位的真正觊觎者。 　 　2、Java 9 即将到来 　　 Oracle早在8月份就发布
  • zoj 3826 Hierarchical Notation(模拟) 阿尔萨斯 rar
    题目链接：zoj 3826 Hierarchical Notation 题目大意：给定一些结构体，结构体有value值和key值，Q次询问，输出每个key值对应的value值。 解题思路：思路很简单，写个类词法的递归函数，每次将key值映射成一个hash值，用map映射每个key的value起始终止位置，预处理完了查询就很简单了。 这题是最后10分钟出的，因为没有考虑value为{}的情
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他