                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /網(wǎng)頁定位導(dǎo)航特效

求大神找出我到底哪里錯了自己找了3遍沒找出

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>地狗購物網(wǎng)-網(wǎng)頁定位導(dǎo)航效果</title>

<style>

* { margin:0;

? ? padding:0; }

body{

?font-size:12px;

?line-height: 1.7;

}

li{

list-style:none;

}

?#content{

? ?width:800px;

margin: 0 auto;

padding: 20px;

?}

?#content h1{ ? color:#F36 ?}

#content ?.item{

? ? padding:20px;

margin-bottom:20px

border: 1px solid #C63;

? ? ? ? ? ? ? ?}

#content .item h2{ font-size:16px;

? ? ? ? ? ? ? ? font-weight:bold;

border-bottom:2px solid #963;

margin-bottom:10px;

}

#content .item li{

display:inline ;

margin-right:10px;

}

#content .item li a img{

width: 230px;

height: 230px;

border: mone;

}

#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:#F6C;

width:80px;

height:50px;

line-height:50px;

text-decoration:none;

text-align:center

}

#menu ul li a:hover,

#menu ul li .current{

color:#FFF;

background:#F69;

}

</style>

$(document).ready(function(){

$(window).scroll(function(){

? var top =$(document).scrollTop();

//console.log(top)

var menu=$('#menu');

var items =$('#content').find('.item');

var currentId= '' ;

items.each(function(){

var m = $(this);

var ?itemTop =m.offset().top;

//console.log( itemTop)

?

?if(top > ?itemTop){

? 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')

}

});

</script>

</head>

<body>

? ? <ul>

? ? ? ? <li><a href='#item1' class='current'>1F 男裝</a></li>

? ? ? ? <li><a href='#item2'>2F 女裝</a></li>

? ? ? ? <li><a href='#item3'>3F 美妝</a></li>

? ? ? ? <li><a href='#item4'>4F 數(shù)碼</a></li>

? ? ? ? <li><a href='#item5'>5F 母嬰</a></li>

</ul>

</div>

? ?<h1>地狗購物網(wǎng)</h1>

? ? ? ?<div id='item1' class="item">

? ? ? ? ?<h2>1F 男裝<h2>

? ? ? ? ? ? ?<ul>

? ? ? ? ? ? ?<li><a href='#'><img src='1.jpg'></a></li>

? ? ? ? ? ? ?</ul>

? ? ? ?</div>

? ? ? ? ? ? ? <div id='item2' class="item">

? ? ? ? ?<h2>2F 女裝<h2>

? ? ? ? ? ? ?<ul>

? ? ? ? ? ? ?<li><a href='#'><img src='2.jpg'></a></li>

? ? ? ? ? ? ?</ul>

? ? ? ?</div>

? ? ? ? ? ? ? <div id='item3' class="item">

? ? ? ? ?<h2>3F 美妝<h2>

? ? ? ? ? ? ?<ul>

? ? ? ? ? ? ?<li><a href='#'><img src='3.jpg'></a></li>

? ? ? ? ? ? ?</ul>

? ? ? ?</div>

? ? ? ? ? ? ? <div id='item4' class="item">

? ? ? ? ?<h2>4F 數(shù)碼<h2>

? ? ? ? ? ? ?<ul>

? ? ? ? ? ? ?<li><a href='#'><img src='4.jpg'></a></li>

? ? ? ? ? ? ?</ul>

? ? ? ?</div>

? ? ? ? ? ? ? <div id='item5' class="item">

? ? ? ? ?<h2>5F 母嬰<h2>

? ? ? ? ? ? ?<ul>

? ? ? ? ? ? ?<li><a href='#'><img src='5.jpg'></a></li>

? ? ? ? ? ? ?</ul>

? ? ? ?</div>

? ? ? ?

? ? ??

? ??

</div>

</body>

</html>

arpmaomao

2016-09-23

源自：網(wǎng)頁定位導(dǎo)航特效 4-3

關(guān)注問題我要回答

1302

操作

收起

5 回答

慕萊塢3689982 回答被采納 +3 積分
2016-09-23

不好意思我剛才看錯了我是引入的本地的 ? 是menu.find('[href="+ currentId +"]').addClass('current')錯了，改成"[href="+ currentId +"]"就好了，這樣是有效的，但是我看評論有說要再加單引號的，"[href='"+ currentId +"']"這樣應(yīng)該更好吧，不知是否與jquery版本有關(guān)