12 2017 档案

摘要:封装异步请求 1、将函数作为参数进行使用 2、因为获取数据是在一个注册事件中获取的,所以只有事件触发的时候才会调用此函数 阅读全文
posted @ 2017-12-29 10:11 var_obj 编辑
摘要:XML数据格式 首行必须是版本号和格式等信息 最外层需要一个根节点进行包裹 标签有开头有结尾,效率低下 php中设置header需要将content-type设置成text/xml 浏览器读取XML文件是用ajax.responseXML 浏览器接收到的是文档树,可以用访问节点的方式获取值 JSON 阅读全文
posted @ 2017-12-29 10:09 var_obj 编辑
摘要:基础概念 1、异步请求可以做到偷偷向服务器发送请求,而页面却不刷新 2、get异步请求传递参数是通过url追加键值对的方式 3、post异步请求比较特殊,需要设置请求的类型 readyState:存有 XMLHttpRequest 的状态。从 0 到 4 发生变化 status:200: "OK"; 阅读全文
posted @ 2017-12-28 12:00 var_obj 编辑
摘要:上传文件 1、get是传不了文件的,只能用post 2、enctype需要重新设置,默认是application/x-www-form-urlencoded,会在发送到服务器之前,所有字符都会进行编码(空格转换为 "+" 加号,特殊符号转换为 ASCII HEX 值) 3、修改上传文件大小设置,在p 阅读全文
posted @ 2017-12-28 10:58 var_obj 编辑
摘要:header 数据类型 表达式 数组 二维数组 单双引号 GET POST 嵌入html中 注意事项 1、拼接字符串是用.而不是+ 2、在进行表单提交时,最好在127.0.0.1中进行访问 3、php文件的命名不能出现中文 阅读全文
posted @ 2017-12-27 10:26 var_obj 编辑
摘要:AMP环境 AMP(Apache、MySQL、PHP)是三个独立的软件,但是对于初学者而言分别安装以及配置需要掌握一定的软件知识,所以就有了很多AMP集成环境帮助我们简化安装 ——WAMP WAMP安装 1、下一步下一步 2、修改httpd.conf文件(左键小图标==》Apache==》httpd 阅读全文
posted @ 2017-12-26 18:00 var_obj 编辑
摘要:基本概念 1、HTML5中我们可以轻松的构建一个离线(无网络状态)应用,只需要创建一个cache manifest文件 2、可配置需要缓存的资源,网络无连接应用仍可用,本地读取缓存资源,提升访问速度,增强用户体验,减少请求,缓解服务器负担 3、使用上只需要一个普通文本文件,其中列出了浏览器应缓存以供 阅读全文
posted @ 2017-12-26 11:39 var_obj 编辑
摘要:我们可以通过window.onLine来检测,用户当前的网络状况,返回一个布尔值 注意事项:如果在加载网页前就已经处于在线状态是不会触发程序的在线事件,同理离线也是 阅读全文
posted @ 2017-12-26 11:06 var_obj 编辑
摘要:基本概念 1、HTML5规范允许用户自定义网页上任一元素全屏显示 2、requestFullscreen() 开启全屏显示、cancleFullscreen() 关闭全屏显示 3、不同浏览器兼容性不一样 4、全屏伪类div:-ms-fullscreen,表示在全屏后的状态 阅读全文
posted @ 2017-12-26 11:04 var_obj 编辑
摘要:基本概念 1、传统方式我们以document.cookie来进行存储的,但是由于其存储大小只有4k左右,并且解析也相当的复杂,给开发带来诸多不便 2、h5存储设置、读取方便,而且容量较大,sessionStorage约5M、localStorage约20M 3、h5存储只能存储字符串,可以将对象JS 阅读全文
posted @ 2017-12-26 10:47 var_obj 编辑
摘要:获取地理位置 地理坐标抓取 百度API展示 阅读全文
posted @ 2017-12-26 10:29 var_obj 编辑
摘要:基本情况 在HTML5的规范中,我们可以通过为元素增加draggable="true"来设置此元素是否可以进行拖拽操作,其中图片、链接默认是开启的。 拖拽元素 页面中设置了draggable="true"属性的元素 目标元素 任意元素都能成为目标元素 事件监听 默认事件 拖拽案例 阅读全文
posted @ 2017-12-24 17:04 var_obj 编辑
摘要:自定义进度条 1、video标签是内联块,可以设置宽高,但是需要用大盒子将其包裹起来进行定位 2、小盒子设计成进度条样式,并进行定位 3、进度条样式中的特殊按钮可以用web字体 4、通过点击实现视频的暂停/播放 改变按钮的样式 5、获取视频的总时长,放到totalTime中 6、当视频播放的时候, 阅读全文
posted @ 2017-12-24 16:53 var_obj 编辑
摘要:基本方法 基本属性 基本事件 全屏方法 更多介绍 阅读全文
posted @ 2017-12-24 15:22 var_obj 编辑
摘要:鼠标滚轮 基本描述 1、我们使用插件fullpage,为了更好的兼容性 2、动画效果是在滚动到这一屏时触发的,此时给当前屏幕加current类,其他的移除current类 3、动画的效果的过渡状态是必须在移除current类的时候移除,在添加current类的时候添加 网址:http://www.d 阅读全文
posted @ 2017-12-22 16:38 var_obj 编辑
摘要:基本介绍 1、自定义网页特殊字体,无需考虑用户电脑上是否安装了此特殊字体,从此把特殊字体处理成图片的时代便成为了过去。 2、支持程度比较好,甚至IE低版本浏览器也能支持。 3、web字体的大小鉴定是字体的高度 字体格式 1、.eot格式:IE专用字体,支持浏览器IE4+ 2、.ttf格式:Windo 阅读全文
posted @ 2017-12-22 14:54 var_obj 编辑
摘要:1、有图片的盒子,最好是父盒子设置伸缩属性,a标签设置伸缩比例1,img标签宽度100% 2、不要见到父盒子就设置伸缩属性,而是根据子盒子是否占据一行,若是子盒子占据一行,那么只要给子盒子设置伸缩比例就行了 3、父盒子设置伸缩属性,子盒子的盒子模式就会变成box-sizing:border-box 阅读全文
posted @ 2017-12-22 14:36 var_obj 编辑
摘要:基本概念 1、父盒子设置了伸缩属性,子盒子设置伸缩比例 2、以上设置完之后子盒子会按照比例分布在父盒子中 3、当设置伸缩比例时默认会按照x轴方向分配,因为默认情况下伸缩布局主轴方向是x轴方向 4、设置伸缩属性,没有设置具体宽度,默认是100% 5、父盒子设置了伸缩属性,子盒子设置伸缩比例,子盒子不会 阅读全文
posted @ 2017-12-22 11:51 var_obj 编辑
摘要:基本概念 1、主轴:Flex容器的主轴主要用来配置Flex项目,默认是水平方向 2、侧轴:与主轴垂直的轴称作侧轴,默认是垂直方向的 3、方向:默认主轴从左向右,侧轴默认从上到下 4、主轴和侧轴并不是固定不变的,通过flex-direction可以互换 效果特征 1、设置了伸缩属性,在没有设置宽度的情 阅读全文
posted @ 2017-12-22 11:11 var_obj 编辑
摘要:基本概念 1、多列布局类似报纸或杂志中的排版方式,上要用以控制大篇幅文本。 2、跨列属性可以控制横跨列的数量 阅读全文
posted @ 2017-12-21 12:00 var_obj 编辑
摘要:1、秒钟转360度需要60s分60步 2、分针转360度需要3600s分60步 3、秒钟转360度需要43200s分60步 阅读全文
posted @ 2017-12-21 11:55 var_obj 编辑
摘要:无缝滚动:是两组拼在一起的 阅读全文
posted @ 2017-12-21 11:51 var_obj 编辑
摘要:太阳的发散效果主要是利用transform: scale(1.3),将物体变大 阅读全文
posted @ 2017-12-21 11:50 var_obj 编辑
摘要:太阳系主要利用定位,伪元素 参考资料:cssRules js操作cssRules 阅读全文
posted @ 2017-12-21 11:48 var_obj 编辑
摘要:基本介绍 动画序列 1、gun是序列名称 2、通过百分比将动画序列分割成多个节点 3、在各节点中分别定义各属性 4、起始位置最好写上起始值 关键属性 参考资料:https://blog.csdn.net/q1056843325/article/details/53308506?locationNum 阅读全文
posted @ 2017-12-21 11:43 var_obj 编辑
摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> * { padding: 0; margin: 0; } body { text-align: center; ba 阅读全文
posted @ 2017-12-21 11:38 var_obj 编辑
摘要:1、立体汉字:旋转点left,attr(data-cont)可获取自定义属性值,skewY(倾斜转换)参考地址 2、旋转导航:先移动后旋转,li标签需要延迟执行旋转 注意::hover事件触发自己的:afert伪元素事件中间是没有空格的 阅读全文
posted @ 2017-12-21 11:36 var_obj 编辑
摘要:立方体:父盒子规定了3d呈现属性,立方体做旋转运动 移动顺序:1、每个盒子都先移动100px,然后再做相应的旋转 2、只有这样立方体的几何中心点与父盒子的几何中心点是一样的 阅读全文
posted @ 2017-12-21 11:18 var_obj 编辑
摘要:1、音乐盒子:触碰盒子,盖子会打开 2、百度钱包:触碰钱包,钱包,会180度旋转 阅读全文
posted @ 2017-12-21 10:47 var_obj 编辑
摘要:角度旋转 rotateX:默认以center绕x轴旋转 rotateY:默认以center绕y轴旋转 rotateZ:默认以cente绕z轴r旋转 距离位移 translateX:以x轴为基准移动,右为正值 translateY:以y轴为基准移动,上为正值 translateZ:以z轴为基准移动,靠 阅读全文
posted @ 2017-12-21 10:30 var_obj 编辑
摘要::hover事件触发自己的:afert伪元素事件中间是没有空格的 阅读全文
posted @ 2017-12-20 13:04 var_obj 编辑
摘要:transform 属性 1、向元素应用 2D 或 3D 转换 2、该属性允许我们对元素进行旋转、缩放、移动或倾斜。 缩放与位移 角度旋转 倾斜 skew(deg, deg):可以使元素按一定的角度进行倾斜,可为负值,第二个参数不写默认为0 阅读全文
posted @ 2017-12-19 15:39 var_obj 编辑
摘要:transition:1、开始状态 2、终止状态 3、过渡属性 属性详解 泡泡案例 小米案例 阅读全文
posted @ 2017-12-19 14:39 var_obj 编辑
摘要:线性渐变 注意事项: 1、方向默认是从上到下 2、方向也可以是角度 3、方向:to left、to right、to bottom、tot op、45deg 径向渐变 渐变球体 阅读全文
posted @ 2017-12-19 10:53 var_obj 编辑
摘要:背景大小 背景裁剪 backgrond-clip:1、border-box 2、padding-box(默认padding) 3、content-box 多背景图片 阅读全文
posted @ 2017-12-19 10:45 var_obj 编辑
摘要:精确控制 复合属性 边框颜色 边框阴影 边框图片 注意事项:这个有谷歌高版本有bug,不会显示 阅读全文
posted @ 2017-12-19 10:28 var_obj 编辑
摘要:CSS3的浏览器私有属性前缀是一个浏览器生产商经常使用的一种方式。它暗示该CSS属性或规则尚未成为W3C标准的一部分,像border-radius等属性需要加私有前缀才奏效 1、-webkit-:谷歌、苹果 2、-moz-:火狐 3、-ms-:微软 4、-o-:欧朋 阅读全文
posted @ 2017-12-18 14:36 var_obj 编辑
摘要:box-sizing属性 阅读全文
posted @ 2017-12-18 14:07 var_obj 编辑
摘要:基本结构 凹凸文字 阅读全文
posted @ 2017-12-18 13:42 var_obj 编辑
摘要:CSS2 1、opacity,可以设置透明度,但是父盒子设置了透明度会影响子盒子 CC3 1、transparent属性,但是不可改变透明值 2、rgba():r--red g--green b--blue a--alpha透明度 3、hsla(): H: 色调 S:饱和度 L:亮度 A alpha 阅读全文
posted @ 2017-12-18 13:34 var_obj 编辑
摘要:复习 div>p: 子代 div+p:div后面相邻的第一个p div~p: div后面所有的兄弟p 属性选择器 标志:[];区别于id选择器:#,区别于类名选择器:. 特殊符号:^:开头 $:结尾 *:包含 E[title] : 选中页面的E元素,并且E需要带有title属性 E[title="a 阅读全文
posted @ 2017-12-18 13:14 var_obj 编辑
摘要:元素获取 1、document.getElementsByClassName ('class') 通过类名获取元素,以类数组形式存在。 2、document.querySelector(‘div’) 通过CSS选择器获取元素,符合匹配条件的第1个元素。 3、document.querySelecto 阅读全文
posted @ 2017-12-15 15:51 var_obj 编辑
摘要:<audio> 1、autoplay 自动播放 2、controls 是否显不默认播放控件 3、loop 循环播放 4、preload 预加载 同时设置autoplay时些属性失效 5、由于版权等原因,不同的浏览器可支持播放的格式是不一样的 <video> 1、autoplay 自动播放 2、con 阅读全文
posted @ 2017-12-15 15:35 var_obj 编辑
摘要:type类型 表单元素 1、<datalist>数据列表与input标签使用 2、<keygen>生成加密字符串,谷歌没有效果 3、<output>元素用于不同类型的输出,比如计算或脚本输出 4、<meter>表示度量器,不建议用作进度条 5、<progress>进度条 表单属性 autocompl 阅读全文
posted @ 2017-12-15 14:31 var_obj 编辑
摘要:传统布局 html5布局 兼容问题 常用新语义标签 阅读全文
posted @ 2017-12-15 02:42 var_obj 编辑
摘要:1、遮罩层宽高100%,position,不占位 2、注册a标签的删除事件,用on()方法,以方法可以动态添加,之前js需要利用冒泡属性(父标签注册事件,子标签冒泡,target li触发事件) 3、$(".add input:eq(1)").prop("checked")?$(".add inpu 阅读全文
posted @ 2017-12-14 23:51 var_obj 编辑
摘要:多库共存:jQuery占用了$ 和jQuery这两个变量。当在同一个页面中引用了jQuery这个js库,并且引用的其他库(或者其他版本的jQuery库)中也用到了$或者jQuery这两个变量,那么,要保证每个库都能正常使用,这时候就有了多库共存的问题。 阅读全文
posted @ 2017-12-14 22:34 var_obj 编辑
摘要:链式编程 1、原理:return this; 2、通常情况下,只有设置操作才能把链式编程延续下去。因为获取操作的时候,会返回获取到的相应的值,无法返回 this。 3、end():结束当前链最近的一次过滤操作,并且返回匹配元素之前的状态。 隐式迭代 1、含义:方法的内部会为匹配到的所有元素进行循环遍 阅读全文
posted @ 2017-12-14 22:14 var_obj 编辑
摘要:事件绑定 1、简单事件绑定 2、bind():不推荐使用 3、delegate() 4、on() 事件解绑 1、unbind() 2、undelegate() 3、off() 事件触发 1、简单事件触发 2、trigger():触发浏览器行为 3、triggerHandler():不触发浏览器行为 阅读全文
posted @ 2017-12-14 17:56 var_obj 编辑
摘要:获取宽:$(".box").width() 设置宽:$(".box").width(200) 获取高:$(".box").height() 设置高:$(".box").height(200) 总结:很鸡肋,一般设置可通过css()方法设置 阅读全文
posted @ 2017-12-14 17:17 var_obj 编辑
摘要:1、undefined == false //返回false 2、null == false //返回false 3、undefined == null //返回true 4、undefined null //返回false 阅读全文
posted @ 2017-12-14 17:12 var_obj 编辑
摘要:val():获取标签中的value属性的值。带有参数是赋值(类比js中的value属性) text():获取双闭合标签中的文本值。(不识别标签)(类比innerText) html():获取双闭合标签中的文本值。(识别标签)(类比innerHTML) 阅读全文
posted @ 2017-12-14 16:47 var_obj 编辑
摘要:属性获取:attr(属性名), 属性设置:attr(属性名,具体值) 移除属性:removeAttr(属性名) 特殊情况:prop(属性名)、prop(属性名,具体值);表单中状态属性checked、selected、disabled要使用.prop()方法 使用技巧:整体移除class属性,可以用 阅读全文
posted @ 2017-12-14 16:42 var_obj 编辑
摘要:创建节点 1、$():创建一个li标签 2、html():创建一个li标签并同时添加到ul盒子中,这个添加实际上是整体替换 添加节点 1、append():在ul盒子内最后一位添加li标签 2、appendTo():同上,只是添加的对象在前面 3、prepend():在ul盒子内第一位添加li标签 阅读全文
posted @ 2017-12-13 15:49 var_obj 编辑
摘要:为什么要停止动画? 对同一个元素,如果拥有一个以上的动画对其加以作用,那么后面的动画会被放入一个动画队列中。动画队列的动画是在其上一个动画完成以后才会执行。 控制两个参数四种情况 1、第一个参数表示后续动画是否要执行:true:后续动画不执行 ;false:后续动画会执行 2、第二个参数表示当前动画 阅读全文
posted @ 2017-12-13 13:07 var_obj 编辑
摘要:动画方法:animate(json,1000, function (){}) 参数说明:json代表属性设置,1000是动画时间,最后一个是回调函数,其中动画时间可选 属性支持:http://www.w3school.com.cn/jquery/effect_animate.asp 阅读全文
posted @ 2017-12-13 12:55 var_obj 编辑
摘要:显示隐藏 1、显示:show(),参数 毫秒值、slow(600ms)、 normal(400ms)、 fast(200ms) 2、隐藏:hide(),参数 毫秒值、slow(600ms)、 normal(400ms)、 fast(200ms) 3、回调函数:show(2000,function() 阅读全文
posted @ 2017-12-13 12:37 var_obj 编辑
摘要:toggle() 显示隐藏 toggleClass 添加类或者删除类 阅读全文
posted @ 2017-12-13 12:22 var_obj 编辑
摘要:添加类:addClass 删除类:removeClass 判断类是否存在:hasClass 阅读全文
posted @ 2017-12-13 12:18 var_obj 编辑
摘要:js注册事件this代表的dom对象 jQuery注册事件this代表的也是dom对象,所以需要$(this)转成jQuery对象 阅读全文
posted @ 2017-12-13 12:15 var_obj 编辑
摘要:js对象与jquery对象的相互转化: 1、$(js对象) 2、$(selector).get(索引)、$(selector)[索引] 阅读全文
posted @ 2017-12-13 09:55 var_obj 编辑
摘要:基本选择器 层级选择器 基本过滤选择器 筛选选择器 注意事项 1、后代选择器包括儿子孙子重孙子....而子代选择器只包括儿子。 2、:odd表示的索引号是奇数,实际显示效果是偶数行;:even表示的索引号是偶数,实际显示效果是奇数行。 阅读全文
posted @ 2017-12-12 13:29 var_obj 编辑
摘要:$()与jQuery() jQuery中$函数,根据传入参数的不同,进行不同的调用,实现不同的功能。返回的是jQuery对象 jQuery这个js库,除了$之外,还提供了另外一个函数:jQuery jQuery函数跟$函数的关系:jQuery $; jQuery与js区别 jquery有一层功能皮肤 阅读全文
posted @ 2017-12-12 13:11 var_obj 编辑
摘要:中文网 http://www.css88.com/jqapi-1.9/ 版本兼容问题 版本一:1.x版本,兼容IE678 版本二:2.x版本,不兼容IE678 入口函数区别 阅读全文
posted @ 2017-12-12 12:46 var_obj 编辑
摘要:trim()、replace()、search() trim()IE678的兼容写法 阅读全文
posted @ 2017-12-12 10:16 var_obj 编辑
摘要:验证座机号码 验证中文账号 表单验证 阅读全文
posted @ 2017-12-11 16:09 var_obj 编辑
摘要:正则的声明: 1、构造函数:var 变量名= new RegExp(/表达式/); 2、直接量:var 变量名= /表达式/; test()方法: 1、正则对象方法,检测测试字符串是否符合该规则,返回true和false,参数(测试字符串) 2、Boolean = 表达式.test("要验证的内容" 阅读全文
posted @ 2017-12-11 16:02 var_obj 编辑
摘要:1、opacity和zIndex的综合运用 2、样式的数组的替换:向右边滑动 删除样式数组第一位并在数组最后添加;向左边滑动 删除样式数组最后一位并在数组前添加 3、开闭原则,只有当回调函数执行完毕以后,我再次点击滑动按钮才有用 阅读全文
posted @ 2017-12-11 11:24 var_obj 编辑
摘要:1、opacity问题:IE678支持filter: alpha(opacity=50)取值1-100;小数位容易精度丢失,所i有统一json字符串设置为百进制,赋值时除以100 2、zIndex问题:层级不需要徐徐渐进值的递增或者递减,而是一下赋值到目标值 阅读全文
posted @ 2017-12-11 11:12 var_obj 编辑
摘要:手风琴 1、排他思想 2、ul宽度需要大一点,防止li撑开跑下去 3、一个变大其他所有变小,变小不能太小,不然会出现空白 仿360开机 1、首先下盒子高度变为0,之后整体盒子宽度变为0 2、本例子没有用图片,最好盒子以图片形式为好 阅读全文
posted @ 2017-12-07 17:31 var_obj 编辑
摘要:在知道如何获取内嵌式和外链式的标签属性值之后,我们再次封装缓慢动画: 单个属性 多个属性 回调函数 阅读全文
posted @ 2017-12-07 17:23 var_obj 编辑
摘要:在函数中,var声明的是局部变量,不带var的是隐式全局变量 阅读全文
posted @ 2017-12-07 11:41 var_obj 编辑
摘要:样式获取 普通获取属性方式div.style.width或者div.style["width"]无法获取内嵌和外链式,只能获取行内式 window.getComputedStyle(div, null) 返回元素的长宽等带有单位px 第二个参数是伪类,没有填null div.currentStyle 阅读全文
posted @ 2017-12-05 17:45 var_obj 编辑
摘要:模态框 1、因为a链接和和顶级document都注册了单击事件,所以要阻止a链接向父级盒子冒泡,不然又会从document的单击事件走一遍 2、在document的单击事件中,只需要判断触发事件的目标元素是不是白色盒子部分就行了 事件委托 1、普通注册事件没有办法为新创建的元素绑定事件。所以我们要使 阅读全文
posted @ 2017-12-05 16:49 var_obj 编辑
摘要:事件冒泡与事件捕获 1、冒泡:addEventListener("click",fn,false)或者addEventListener("click",fn);捕获:addEventListener("click",fn,true)。 2、区别:冒泡是从触发该事件的目标节点一层一层往上将同种类型的事 阅读全文
posted @ 2017-12-05 15:16 var_obj 编辑
摘要:clientTop、clientLeft: clientTop:盒子的上boder clientLeft:盒子的左border clientWidth与clientHeight 1、在有DTD情况下: document.body.clientWidth、document.body.clientHei 阅读全文
posted @ 2017-12-05 14:57 var_obj 编辑
摘要:1、核心思想与之前的拖拽盒子是一样的 2、完全将鼠标在盒子中的坐标给滚动条是错的,因为这样会使滚动条顶部立刻瞬间移动到鼠标位置 3、必须在鼠标按下事件时记住鼠标在滚动条内部的坐标,再将鼠标在盒子中的坐标给滚动条时要减去这个相对距离 4、超出部分内容:超出部分移动距离=滚动条需要移动的距离:滚动条移动 阅读全文
posted @ 2017-12-05 09:47 var_obj 编辑
摘要:注意事项: 1、opacity是全部元素变透明,rgba只是背景色变透明 2、先是注册鼠标按下的事件,此时就需要记录鼠标在盒子中的坐标 3、再在鼠标按下事件中注册鼠标移动事件,此时鼠标的坐标是不断变化的,盒子的坐标就是鼠标的坐标减去鼠标在盒子的坐标 4、top.onmousemove = funct 阅读全文
posted @ 2017-12-04 17:20 var_obj 编辑
摘要:放大镜: 1、比例系数要恒定:在系数为4的情况下,若原图是820*512,那么小图必须是205*128,放大镜若是50,原图显示区域必须200 2、计算鼠标在小图中的坐标 3、放大镜需要在鼠标中间位置,也就是鼠标在盒子中的坐标减去其宽度高度的一半 4、放大镜移动范围:marginLeft、margi 阅读全文
posted @ 2017-12-04 14:58 var_obj 编辑
摘要:核心思想: 1、复杂版本:鼠标pageX、pageY的值减去盒子距离顶端的offsetLeft、offsetTop值就是鼠标在盒子中的坐标 2、简单版本:offsetX、offsetY就可获取鼠标相对于事件触发对象的坐标,以事件触发对象左上角为基准点 阅读全文
posted @ 2017-12-04 14:46 var_obj 编辑
摘要:注意事项: 1、pageX、pageY的兼容问题 2、使目标移动鼠标中间位置还必须减去盒子宽度的一半 阅读全文
posted @ 2017-12-04 14:40 var_obj 编辑
摘要:触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息: 普通浏览器支持 event(传参),IE678支持 window.event(无参),兼容写法: client、page、screen三者之间的区别: pageX、pageY在IE678中不支持,兼容写法 阅读全文
posted @ 2017-12-04 10:41 var_obj 编辑
摘要:固定导航栏 1、计算导航栏到顶部的距离值 2、当scrollTop值大于这个距离值就添加定位,当小于距离值后解除定位 注意事项:当导航栏添加定位之后,导航栏就脱离了文档流,也就是不占位了,下面的盒子就会顶上来,所以要给下面盒子添加padding-top值 两侧跟随广告 1、之前都是offsetLef 阅读全文
posted @ 2017-12-01 13:48 var_obj 编辑
摘要:DTD未声明:document.body.scrollTop DTD已声明:document.documentElement.scrollTop 火狐谷歌IE9:window.pageYOffset compatMode:可以判断是否声明DTD,CSS1Compat是,BackCompat否 复杂版 阅读全文
posted @ 2017-12-01 10:33 var_obj 编辑
摘要:document.title——文档标题 document.head——文档头标签 document.body——文档的主体 document.documentElement 表示整个文档的html标签,也就是说结构中的html标签并不是通过document.html来访问的。 阅读全文
posted @ 2017-12-01 09:57 var_obj 编辑
摘要:scrollWidth:父div宽度小于子div宽度,父div scrollWidth宽度为子div的宽度,大于则为本身的宽度width+padding scrollHeight:父div高度小于子div高度,父div scrollHeight高度为子div高度,大于则为本身的高度height+pa 阅读全文
posted @ 2017-12-01 09:51 var_obj 编辑
摘要:需求: 1、鼠标移动到哪里,云彩移动到哪里 2、鼠标离开,云彩回到原点 3、鼠标离开,云彩回到之前点击的地方 阅读全文
posted @ 2017-12-01 00:50 var_obj 编辑
摘要:核心思想: (1)相对于匀速移动,盒子每次移动的步长都是变化的,公式:盒子位置=盒子本身位置+(目标位置-盒子本身位置)/10 (2)在盒子位置与目标距离小于10px时,其步长必然是小数,又由于offsetLeft的变态的逢4进值,那么只要小数点的值小于4就会停滞不前 (3)所以要么往上取整,要么往 阅读全文
posted @ 2017-12-01 00:47 var_obj 编辑

点击右上角即可分享
微信分享提示