随笔分类 -  js记录

摘要:1.viewport的概念能在移动设备上正常显示那些传统的为桌面浏览器设计的网站宽度2.css中的1px并不等于移动设备的1px 在iphone3上,一个css像素确实是等于一个屏幕物理像素的。后来随着技术的发展,移动设备的屏幕像素密度越来越高,从iphone4开始,苹果公司便推出了所谓的Reti... 阅读全文
posted @ 2015-12-18 09:15 AlanTao
摘要:$(".wrap li").click(function(){ var index1 = $(this).index(".wrap li"); //传递一个选择器,返回在所有li中的做引位置,不会因在同辈li中插入其他标签而打乱下标索引 var index... 阅读全文
posted @ 2015-11-24 10:06 AlanTao
摘要:一.引入百度地图API(需要注册开发者帐号) <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=snQGxFgOT5CCKh9DgN9fNs7t"></script> 二.在js里添百度地图 //添加红 阅读全文
posted @ 2015-10-25 21:36 AlanTao
摘要:判断鼠标进入容器的方向1.前几天在万圣节专题项目中用到了鼠标坐标page事件,随着鼠标背景图片移动形成有层次感的效果,但page事件在IE低版本不支持,所以还要做兼容。在研究page事件同时无意中想到了鼠标从不同方向进入容器的想法。其中涉及到Math.atan2(y,x)等圆心事件,在研究其代码时对... 阅读全文
posted @ 2015-10-11 22:29 AlanTao
摘要:关于js鼠标事件综合各大浏览器能获取到坐标的属性1.page随滚动条变化(pageY会增加滚动条滚动的距离),兼容性:除IE6/7/8不支持外,其余浏览器均支持;2.clientX/Y获取到的是触发点相对浏览器可视区域左上角距离(不随页面滚动而改变,clienY不会增加),兼容性:所有浏览器均支持;... 阅读全文
posted @ 2015-10-09 10:59 AlanTao
摘要:今天项目用到了html5的视频播放,用了公司同事用的html5media插件,可以让所有的浏览器支持video标签的视频播放,不过视频格式必须是MP4格式的H264编码,这样子在IE7/8下也是可以播放滴。不过IE7下不能点击视频里播放停止。firefox支持不太理想。 1.video标签的使用。 阅读全文
posted @ 2015-09-17 18:31 AlanTao
摘要:1.jquery实现代码$(function(){ var _win = $(window); var htmlTop = $("html,body"); //页面滚动的元素 var oMenu = $("#menu"); var Menu... 阅读全文
posted @ 2015-09-13 22:59 AlanTao
摘要:原生js获取页面中的className,涉及到document.getElementsByClassName1.单个className的获取function getByClassName(oParent,sClass){ var elements = oParent.getElementsBy... 阅读全文
posted @ 2015-09-13 18:51 AlanTao
摘要:1.client属性是可视区里的鼠标位置,先兼容事件对象eventvar oEvent = e || event2.获取可视区里的鼠标坐标。alert(oEvent.clientX +"," + oEvent.clientY) 3.获取整个页面里的鼠标坐标,用先用scrollTop计算可视区与浏览... 阅读全文
posted @ 2015-09-06 10:15 AlanTao
摘要:1.原理,循环元素,然后获取每个子元素的宽度相加。var sumWidth = 0;$("ul").find("li").each(function(){ sumWidth += $(this).width();});alert(sumWidth) 阅读全文
posted @ 2015-08-30 16:53 AlanTao
摘要:1.animate的格式 $("div").animate({fontSize:"20px"},3000) $("#wrap").click(function(){ $(this).stop().animate({width:"200px"},3000) })2.连续动画$("... 阅读全文
posted @ 2015-08-27 16:25 AlanTao
摘要:/*什么是SWFObject?*/1.是一个用于在HTML中方面插入Adobe Flash媒体资源(*.swf文件)的独立、敏捷的JavaScript模块2.引用swfobject插件3.在你的 HTML 中写一个用来放 Flash 的容器,比如,并随便给一个 id 比如 flashcontent。... 阅读全文
posted @ 2015-08-17 15:32 AlanTao
摘要:/*创建js的ajax库*//*打电话:1.有手机设备,2.拨号,3.说,4.听*//*1.创建Ajax对象,2连接到服务器,3发送请求,4接收返回值*/function ajax(url,fnSuccess,fnFaild){ /*1.创建Ajax对象*/ // var oAjax =... 阅读全文
posted @ 2015-08-12 16:31 AlanTao
摘要:/*1.简单拖拽,三个事件:鼠标按下,鼠标抬起,鼠标移动*/window.onload = function(){ var oDiv = document.getElementById("wrap"); var disX = 0; //横向坐标 var disY = 0... 阅读全文
posted @ 2015-08-07 14:47 AlanTao
摘要:1.document代表是整个页面,比如鼠标坐标一般用document,用body也可以,但body里的内容必须撑起。2.event对象,IE用event,FF与chrome有event参数;(获取鼠标在页面的坐标)document.onclick = function(ev){ var oEve... 阅读全文
posted @ 2015-08-03 11:54 AlanTao
摘要:1 /*完美运动框架*/ 2 //1.先清除定时期,2,获取样式,如果是opacity则单独解决,3,定义速度,4,定义当前值是否到达目的地,5,判断当前值是否到达目的地,6运动基本,如果是opacity 3 function startMove(obj,json,fnEnd){ 4 cl... 阅读全文
posted @ 2015-08-02 19:44 AlanTao
摘要:今天做了一个专题,需要用到全屏滚动效果,在百度找了一jquery插件,fullPage.js,只有一天的时间就要完成,只是简单的了解下就开始做专题了。demo地址:http://alanjs.comeze.com/2014No1/index.html插件API:http://www.dowebok.... 阅读全文
posted @ 2015-07-23 23:44 AlanTao
摘要:1.原理:任意变高变宽变透明度的运动,有三个参数,obj,attr,iTarget,对象,样式属性,目标,通过currentStyle和getComputedStyle获取样式属性值,然后将其改变。案例:多张图片的透明度变化:jsfunction startMove(obj,attr,iTarget... 阅读全文
posted @ 2015-07-22 15:07 AlanTao
摘要:1.原理:利用speed = (目标值-初始值)/10;然后根据方向来判断是Math.ceil或Math.floor来取整。JSvar oDiv = document.getElementById("wrap"); var oBtn = document.getElementById("btn... 阅读全文
posted @ 2015-07-20 22:05 AlanTao