ナビゲーションバーを通過するこのjqueryコードがあり、選択したリンクの周りにボックスがあります。これは中間のリンクでのみ動作し、他のリンクでは動作しません。何か案は?前もって感謝します。未知の型の取得エラー:jsのヌルのプロパティ 'left'を読み取ることができません
$el = $('#nav').children('li.current');
$エルは空のjQueryオブジェクトは、次のとおりです。
navigation arrow starts
var $el, leftPos, newWidth,
$mainNav = $("#nav");
$mainNav.append("<li id='magic-line'></li>");
var $magicLine = $("#magic-line");
$magicLine
.width($(".current_page_item").width())
.css("left", $(".current_page_item a").position().left)
.data("origLeft", $magicLine.position().left)
.data("origWidth", $magicLine.width());
//scroll arrow
function update_location(){
$el = $('#nav').children('li.current');
leftPos = $el.position().left;
newWidth = $el.width();
$('#nav li:nth-child(4) a').addClass('button-style');
if(window.top.scrollY == 0)
{
setTimeout(function(){
$magicLine.stop().animate({
left: 8,
width: 355
});},1000);
$('#nav li:nth-child(4) a').removeClass('button-style');
}
else
{
setTimeout(function(){
$magicLine.stop().animate({
left: leftPos,
width: newWidth
});},1000);
}
}
$('#magic-line').css('left', '-15px', 'width','411px');
$(window).scroll(function(){
update_location();
});
<div class="navbar-fixed-top navbar" >
<div class="navbar-inner">
<div class="container">
<ul class="nav nav-pills pull-right" id="nav">
<li class="current_page_item" style="width: 355px;"><a href="#home" class="logo" style="display:block; width: 355px;"><img src="images/logo.jpg" class="current_page_item" width="355" alt="" /></a></li>
<li><a href="#vision">VISION</a></li>
<li><a href="#services">SCHOOLS</a></li>
<li><a href="#apply">REQUEST AN EVALUATION</a></li>
<li><a href="#how-it-works">HOW IT WORKS</a></li>
<li><a href="#contact-us">CONTACT US</a></li>
</ul>
</div>
</div>
</div>
function update_location()
問題は、 '$エル= $( '#のNAV')ということである子ども( 'li.current');'ゼロ要素が含まれています。したがって、 '.position()'は 'null'であり、あなたのエラーが観察されます。別の注記:**変数の宣言について聞いたことがある**?すべての 'var'接頭辞が省略されると、変数はグローバルスコープで定義されます。 –
私はそれがnullであることを理解していますが、なぜそれがnullですか? –
これは['jQuery.fn.position'(source)](http://james.padolsey.com/jquery/#v=git&fn=jQuery.fn.position)で定義された動作です:' if(!this [0 ]){return null;} ' - 要素がない場合、' null'が返されます。 –