-
var top = document.documentElement ? document.body.scrollTop : document.documentElement.scrollTop ; 教程写反了查看全部
-
特效设计 锚点查看全部
-
texiaofenxi查看全部
-
IETester包含多个版本的IE，可以方便的用来进行兼容性测试，获取下载或者更多信息可以访问：http://www.my-debugbar.com/wiki/IETester/HomePage查看全部
-
浏览器调试：IETest测试工具，一般情况下ie7下通过了ie8,ie9也没有问题，特别的ie6不支持position的fixed属性，做一个hank()。 通过给样式额外添加hack，以达到ie兼容问题。具体操作是在相应样式前添加“* html”来实现，同时如果有某些属性为ie所不能兼容的，将以特殊表达式来实现，例如：fixed属性。 通过给body添加空白图片的技巧来稳定fixed导航的跳动。 /*IE6 hack*/ *html, *html body{ background-image:url(about:blank); background-attachment:fixed; } * html #menu{ /*position:fixed;*/ position:absolute; top:expression(((e=documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }查看全部
-
jQuery的offset()方法会返回一个对象，包含top和left属性。查看全部
-
1.zencoding插件：可简化敲代码 (1) ul>li*5>a 按tab键 (2) 按住ALT键，就可以竖向选择 2.超链接悬浮或者座位焦点时(a.current 这里的current是设置第一个为默认)文字变白给个背景色 3.定位小技巧： 固定menu的位置的时候fixed完成之后 left:50% 先让要定位的元素居中显示； margin-left:400px;再根据要相对定位的元素的宽度对要定位元素进行位置偏移。查看全部
-
"分析-设计-实现"这是解决问题的一般流程。查看全部
-
$(document).ready(function () { $(window).scroll(function () { var top = $(document).scrollTop(); var menu = $("#menu"); var items = $("#content").find(".item"); var currentId=""; items.each(function(){ var m=$(this); var itemTop=m.offset().top; if (top>itemTop-190){ currentId="#"+m.attr("id"); }else{ return false; } }); var currentLink=menu.find(".current"); if (currentId && currentLink.attr("href")!=currentId){ currentLink.removeClass("current"); menu.find("[href="+currentId+"]").addClass("current"); } // 请补充此处代码，让导航菜单实现在滚动条滚动的时候自动设置焦点 }); });查看全部
-
页面滚动条变化时，触发函数事件，是对滚动条的一种监听查看全部
-
通过给样式额外添加hack，以达到ie兼容问题。具体操作是在相应样式前添加“* html”来实现，同时如果有某些属性为ie所不能兼容的，将以特殊表达式来实现，例如：fixed属性。 通过给body添加空白图片的技巧来稳定fixed导航的跳动。 /*ie6 hack*/ *html #menu { position:absolute; top:expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+100+'px') } /*ie6跳动bug*/ *html,*html body { background-image:url(about:blank); background:-attachment:fixed;查看全部
-
试验代码查看全部
-
解决问题：分析-设计-实现 页面定位导航设计（例如：天猫首页） 1.特效分析 分为左右两部分： 左侧内容，右侧悬浮的导航菜单 左侧滚动，右侧内容不改变位置 点击右侧链接，左侧定位到相应栏目 左侧滚动到相应栏目，右侧定位到对应链接 重难点： 1)样式实现；2)导航与滚动内容之间的定位关联（根据左侧栏目内容距离页面顶部的高度，根据滚动距离将相应栏目内容设置为焦点） 2.特效设计 技术点： 1)锚点:一种页面内的超级链接,使用命名锚记可以在文档中设置标记（html中用name值，html5中废弃了name改用id值），这些标记通常放在文档的特定主题处或顶部；2)关于滚动条定位的事件和方法（借助jQuery）:1.$(selector).scroll(func),用户滚动指定元素（所有可滚动的元素和window对象即浏览器窗口）时，发生scroll事件。2.$(selector).scrollTop([val]),获取/设置指定元素相对于滚动条顶部的偏移。3.$(selector).offset([{top:val1,left:val2}|func])返回/设置匹配元素相对于文档的偏移(返回的对象包含两个整型属性：top 和 left，以像素计),func返回被选元素新偏移坐标的函数。 3.特效实现 1）整体代码编写 2）浏览器调试：IETest测试工具（一款Web browser，包含多个版本的IE，用来测试兼容性），一般情况下ie7下通过了ie8,ie9也没有问题，低版本浏览器若出现兼容问题，用hack解决。 如：ie6不支持position的fixed属性 通过给body添加空白图片的技巧来解决滚动时导航的跳动。 *html, *html body{background-image:url(about:blank);background-attachment:fixed;} * html #menu{ /*position:fixed;*/ position:absolute; top:expression(((e=documentElement.scrollTop)?e:document.body.scrollTop)+100+'px'); }/*实现position：fixed的效果，但有个小问题：滚动时导航条跳动（闪烁）*/查看全部
-
offset是相对于整个页面，当前元素所在的位置 scrollTop是指滚动条相对于整个页面所在的位置。 jQuery的offset()方法将返回的是一个包含top和left属性的对象查看全部
-
jquery 用id获取元素比用 样式选择元素效率高查看全部
举报
0/150
提交
取消