shanlu

2019年9月13日

摘要：布局: wrap > ul > li*3 (一级菜单123) wrap > ul > li > a + li*3 (隐藏的) 案例分析: 鼠标经过 , 会显示下拉菜单鼠标离开, 又会隐藏关键代码代码优化: 完整代码阅读全文

posted @ 2019-09-13 15:19 shanlu 阅读(389) 评论(0) 推荐(0) 编辑

摘要： <1>隐式迭代：偷偷的遍历，在jQuery中，不需要手动写 for 循环了，会自动进行遍历 $("li"）可以获取所有的 li 元素 <2>大版本分类 1.x版本：能够兼容IE678浏览器 2.x版本：不兼容IE678浏览器 1.x和2.x版本jquery都不再更新版本了，现在只更新3.x版本。 3 阅读全文

posted @ 2019-09-13 14:59 shanlu 阅读(230) 评论(0) 推荐(0) 编辑

摘要：返回顶部： ①滚动窗口至文档中的特定位置 ②window.scroll(x,y) ③注意，里面的x 和 y 不跟单位，直接写数字案例分析：带有动画的返回顶部 ①此时可以继续使用我们封装的动画函数 ②只需要把所有的 left 相关的值改为跟页面垂直滚动距离相关就可以了 ③页面滚动了多少，可以通过阅读全文

posted @ 2019-09-13 09:32 shanlu 阅读(678) 评论(0) 推荐(0) 编辑

2019年9月12日

网页轮播图（功能最全）

摘要：布局： slider > ul > li slider > arrow > a> img arrow : z-index:2 ; 注意，ul 里面放着所有轮播图的图片，所以 ul 的宽度必须足够大能够容纳所有图片，这里有4张图片，ul宽度设置为 600% 功能需求： 1，鼠标经过轮播图模块，左右按钮阅读全文

posted @ 2019-09-12 22:27 shanlu 阅读(7357) 评论(0) 推荐(0) 编辑

2019年9月11日

js 元素offset,client , scroll 三大系列总结

摘要： 1，element.offsetWidth : 包括 padding 和边框 2，element.clientWidth : 包括 padding ，不包含边框，内容超出会溢出盒子的时候，就用scrollWidth 3，element.scrollWidth : 不包含边框主要用法： 1，o 阅读全文

posted @ 2019-09-11 15:09 shanlu 阅读(280) 评论(0) 推荐(0) 编辑

仿淘宝固定侧边栏

摘要：案例分析： 1，原先侧边栏是绝对定位 2，当页面滚动到一定位置（这里是滚动到 banner 到达页面顶部的时候），侧边栏改为固定定位 3，页面继续滚动，会让 “ 返回顶部 ” 显示出来（滚动到 main 到达页面顶部的时候） 4，需要用到页面滚动事件 scroll 因为是页面滚动，所以事件源是do 阅读全文

posted @ 2019-09-11 14:58 shanlu 阅读(1063) 评论(0) 推荐(0) 编辑

2019年9月10日

立即执行函数

摘要：立即执行函数： 1，不需要调用，立马能够自己执行的函数 2，写法 (function() { } ( )) 或者 (function () { } ) ( ) 3, 立即执行函数最大的作用就是独立创建了一个作用域，里面所有的变量都是局部变量，不会有命名冲突的情况阅读全文

posted @ 2019-09-10 21:40 shanlu 阅读(184) 评论(0) 推荐(0) 编辑

拖动的模态框

摘要：案例分析： 1，点击弹出层，会弹出模态框，并且显示灰色半透明的遮挡层。 2，点击关闭按钮，可以关闭模态框，并且同时关闭灰色半透明遮挡层。 3，鼠标放到模态框最上面一行，可以按住鼠标拖拽模态框在页面中移动。mousedown mousemove 4，鼠标松开，可以停止模态框移动 mouseup 5, 阅读全文

posted @ 2019-09-10 19:28 shanlu 阅读(1491) 评论(0) 推荐(1) 编辑

2019年9月8日

navigator对象

摘要： navigator对象包含有关浏览器的信息, 它有很多属性 , 我们最常用的是 userAgent ,该属性可以返回由客户机发送服务器的 user-agent 头部的值下面前端代码可以判断用户哪个终端打开页面,实现跳转阅读全文

posted @ 2019-09-08 21:30 shanlu 阅读(179) 评论(0) 推荐(0) 编辑

获取URL参数

摘要：案例分析: ①第一个登陆页面,里面有提交表单, action提交到 index.html页面 ②第二个页面, 可以使用第一个页面的参数, 这样实现了一个数据不同页面之间的传递效果 ③第二个页面之所以可以使用第一个页面的数据, 是利用了URL里面的 location.search 参数 ④在第二个页面阅读全文

posted @ 2019-09-08 21:04 shanlu 阅读(374) 评论(0) 推荐(0) 编辑

公告