Luffy

摘要： <script type="text/javascript"> //那种方式移动 var choMove = false; //是否绑定过click var isClick = true; //引用DIV var oDiv = null; //引用Input var oInput = null; //封装事件绑定的通用对象 var evnetUtil = { addEventHandle:function(oElement,evtype,fun){ oElement.attachEvent?oEle... 阅读全文

摘要： 经过这段时间的学习，参考网上效果和教程写了一些实例。现在总结一下关于在平面中确定点的位置、长度、和角度。 一、勾股定理： 公式：a2+b2 = c2 这个公式是在直角三角形中，两个直角边的平方之和等于斜边的平方; 应用的实例，就是之前写的“苹果菜单”，因为我要知道鼠标距离某个图片中心点的距离，就用到 阅读全文

摘要： $(this).css({"left":Math.sin((ahd*index+ainhd))*radius+dotLeft,"top":Math.cos((ahd*index+ainhd))*radius+dotTop});效果图：分析图：上图中：黑色：是外层容器;黄色：是需要按椭圆运动的图片橙色：每个图片元素距离容器顶部的距离紫色：长半径或短半径;蓝色：图片距离容器顶部最大的距离绿色：坐标轴;白色：椭圆运动轨迹;一、原理分析： 1.1按椭圆运运 前面两个随笔分析了“圆形排列”和“按圆形运动”，知道了“排列”和“运动”这两个以后，再来看这个实例应该就有 阅读全文

摘要： javascript-按圆形排列DIV元素(一)---- 运动http://www.cnblogs.com/lufy/archive/2012/06/21/2558049.html一、原理分析 1.1怎么才能让DIV元素动起来？ 动起来的实质，就是改变DIV的位置，也就是改变其left和top值; 2.2怎么上DIV元素动起来的时候，是在规定的圆周上面？ 通过上一次的分析，让DIV按圆形排队，我们知道了，如要让DIV定位在圆周上面，主要是根据角度(弧度)来实现的。 看下图:上图中，我们B元素和C元素的定位是如何实现的？根据上一次讲的公式,如下：(index:元素的索引值，radius... 阅读全文

摘要： 效果图：一、分析图：绿色边框内：外层的DIV元素,相对定位;白色圆形框：辅助分析的想象形状;白点：为白色圆形的圆心点，中心点，点o;圆心角：角NOG;黄色：需要按圆形排列的，绝对定位的DIV元素;红色点：为每个黄色DIV的坐标点;即绝对定位时的元素，left值 和 top值 ，设置的点;二、涉及到的概念定义：2.1、弧度：弧度是角的度量单位。（红色部分为弧长，角A为弧长对应的圆心角）弧长等于半径的弧，其所对的圆心角为1弧度。(即两条射线从圆心向圆周射出，形成一个夹角和夹角正对的一段弧。当这段弧长正好等于圆的半径时，两条射线的夹角的弧度为1)。根据定义，一周的弧度数为2πr/r=2π，360&# 阅读全文

摘要： 用法：<divid="test"><spanstyle="color:red">test1</span>test2</div>在JS中可以使用：test.innerHTML: 也就是从对象的起始位置到终止位置的全部内容,包括Html标签。 上例中的test.innerHTML的值也就是“<spanstyle="color:red">test1</span>test2 ”。test.innerText: 从起始位置到终止位置的内容,但它去除Html标签 上例中的te 阅读全文

摘要： 下面是闭包：window.onload = function(){ var oli = document.getElementById("list").getElementsByTagName("li"); for(i=0;i<oli.length;i++){ oli[i].onclick = function(n){ return function(){ alert(n); } }(i); } }... 阅读全文

摘要： 拖动的问题，在网上有很多插件，但鼠标在图片上拖动一小段距离，就会在鼠标旁边出现一个禁止的小提示。解决如果点击在图片上无法拖拽的问题：IE通过ev.cancelBubble=true;ev.returnValue = false;来防止图片的事件，注意是放在document.onmousemove中。要用原生的JS，不能用JQUERY！FireFox通过ev.preventDefault();ev.stopPropagation(); 但是是放在titleBar的mousedown事件中。$(function(){ var $img = $("img"); var movin 阅读全文

摘要： 效果图代码部分// JavaScript Document(function($){ $.fn.extend({ "changeTips":function(value){ value = $.extend({ divTip:"" },value) var $this = $(this); var indexLi = 0; //点击document隐藏下拉层 $(do... 阅读全文

摘要： 1.要求：如上图中的，三栏目布局，中间的MAIN是自适应浏览器的宽度，左LEFT固定宽200PX，右RIGHT固定宽200PX;.right,.left{height:300px;width:200px;}.right{ float:right;background:#000000;}.left{ float:left;background:#009933;}.main{background:#F60; height:300px;} <div class="right">RIGHT</div> <div class="left&quo 阅读全文