-
哪里不对啊?没有反应啊: $(document).ready(function(){ $(window).scroll(function(){ var top = $(document).scrollTop(); var menu = $("#menu"); var items = $("#content").find(".item"); var currentId = ""; items.each(function(){ var t = $(this); if(top > t.offset().top-300){ currentId = "#" + t.attr("id"); }else{ return false; } }); var currentLink = menu.find(".current"); if(currentId && currentId.attr("href")!=currentId){ currentLink.removeClass(".current"); menu.find('[href='+currentId+']').addClass("current"); } }); });查看全部
-
jQuery的offset()方法会返回一个对象,包含top和left属性。查看全部
-
全部:查看全部
-
jquery 页面:itemtop-200像素: <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>查看全部
-
描点链接用id 与 href ,name在html5已经取消了查看全部
-
current 的class 为焦点时: #menu ul li a:hover, #menu ul li a .current{ color:#fff; background-color:#0088bb; }查看全部
-
css2 :查看全部
-
css1: *{padding:0; margin:0;} body{ font-size:12px; line-height:1.7; } li{list-style:none;} #content{ width:800px; margin:0 auto; padding:20px; } #content h1{ color:#224444; } #content .item{ padding:20px; margin-bottom:20px; border:1px solid #269ABC; } #content .item h2{ font-size:16px; font-weight:bold; border-bottom:2px solid #0088bb; margin-bottom:10px; } #content .item li{ display:inline; margin-right:10px; } #content .item li a img{ width:230px; height:230px; border:none; } #menu{ position:fixed; top:100px; left:50%; margin-left:400px; width:80px; } #menu ul li a{ display:block; margin:5px 0; font-size:14px; font-weight:bold; color:#ccc; width:88px; height:50px; line-height:50px; text-decoration:none; text-align:center; } #menu ul li a:hover, #menu ul li a .current{ color:#fff; background-color:#0088bb; }查看全部
-
html :alt 用鼠标竖向选择 <div id="menu"> <ul> <li><a href="#" class="current">1F 女装</a></li> <li><a href="#">2F 男装</a></li> <li><a href="#">3F 母婴</a></li> <li><a href="#">4F 数码</a></li> <li><a href="#">5F 美妆</a></li> </ul> </div> <div id="content"> <h1>地购购物</h1> <div id="item1" class="item"> <h1>1F 女装</h1> <ul> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> <li><a href="#"><img src="../img/JM.ico" alt=""/></a></li> </ul> </div> <div id="item2" class="item"> <h1>2F 男装</h1> <ul> <li><a href="#"><img src="../img/1H.ico" alt=""/></a></li> <li><a href="#"><img src="../img/1H.ico" alt=""/></a></li>查看全部
-
特效技术点查看全部
-
特效技术点:查看全部
-
特效设计:查看全部
-
网页定位导航特效中,导航条和滚动条之间的关系是: 导航条随着滚动条的滚动改变焦点,其实就是给相应的项目增加样式,这是这个特效的难点。查看全部
-
分析-设计-实现"这是解决问题的一般流程。查看全部
-
滚动条到上面的距离 与 内容自身的高度距离上面的offsetTop高度查看全部
举报
0/150
提交
取消