-
特效分析:查看全部
-
本案例中的网页定位导航特效主要是指在页面内进行定位导航,适用于内容比较多的单页面网页。查看全部
-
jQuery 事件: offset()事件:获取匹配元素的相对偏移。返回的对象包含两个整型属性:top和left,单位是px。 scrollTop()事件:获取/设置匹配元素的相对滚动条顶部的偏移。 scroll()事件:当用户滚动指定的元素时,会发生scroll事件。scroll事件适用于所有可滚动的元素和window对象(浏览器窗口)查看全部
-
特效所需要掌握的技术点查看全部
-
jQuery 事件: offset()事件:获取匹配元素的相对偏移。返回的对象包含两个整型属性:top和left,单位是px。 scrollTop()事件:获取/设置匹配元素的相对滚动条顶部的偏移。 scroll()事件:当用户滚动指定的元素时,会发生scroll事件。scroll事件适用于所有可滚动的元素和window对象(浏览器窗口)查看全部
-
解决IE6不兼容fixed属性的方法,在css中加入: /*ie6 hack*/ *html,*html body{ background-image:url(about:blank); background-attachment:fixed; } *html menu{ position:absolute; top:expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
通过hack解决ie6不支持position:fixed的办法 /*ie6 hack*/ * html, * html body { background-image: url(about:blank); background-attachment: fixed; } * html #menu { /*position: fixed;*/ position: absolute; top: expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
通过hack解决ie6不支持position:fixed的办法 /*ie6 hack*/ * html, * html body { background-image: url(about:blank); background-attachment: fixed; } * html #menu { /*position: fixed;*/ position: absolute; top: expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
1、让右侧广告正确显示: #content .item{ position: relative; height: 540px; } 2、让导航菜单在左侧固定定位显示: #menu { position: fixed; top: 100px; } 3、让导航菜单实现在滚动时自动设置焦点: items.each(function() { var m = $(this); if(top > m.offset().top - 200) { currentId = m.attr("id"); } else { return false; } }); var curLnk = menu.find(".current"); if(currentId && curLnk.attr("href") != currentId) { curLnk.removeClass("current"); menu.find("[href=" + currentId + "]").addClass("current"); }查看全部
-
网页定位导航特效中,导航条和滚动条之间的关系:导航条随着滚动条的滚动改变焦点,其实就是给相应的项目增加样式查看全部
-
解决问题的流程:分析 -> 设计 -> 实现 分析(要实现的功能): 1、左侧内容+右侧导航条; 2、左侧滚动时,右侧导航的位置不变; 3、左侧滚动到某个栏目时,右侧定位到相应链接; 4、点击右侧链接时,左侧定位到相应栏目。 难点: 1、左右侧的样式; 2、左右侧的定位关联(思路见图): A、B、C分别为1F、2F、3F到视窗顶端的距离; S1、S2表示滚动条的位置,若滚动条在B、C之间,表示目前滚动到2F,此时2F获得焦点。查看全部
-
网页定位导航特效主要是指在页面内进行定位导航,适用于内容比较多的单页面网页查看全部
-
用原生JavaScript获取href: 获取全部网站的值。用#拆分 用jQuery的attr获取href: 只含当前的值,不会获取全部网站查看全部
-
用原生js编写代码时候需要注意浏览器的兼容性,特别是IE的查看全部
-
IE6不支持position:fixed,因此使用hack解决。 1、position的hack: * html #menu{ position: absolute; top: expression((e=document.documentElement.scrollTop ? e : document.body.scrollTop) + 100 + "px"); } 2、防止导航栏跳变: * html, * html body{ background-image: url(about:blank); background-attachment: fixed; }查看全部
举报
0/150
提交
取消