的jQuery JavaScript的條件語句

Question

我有以下jquery代碼

$(document).ready(function() { 

    $('.anipic').hover(function(){ 

     if ($(this).parent().position().left <= 700) { 
      $('.bio').css({ 
       'height': $(this).height()+2, 
       left: $(this).parent().width() 
      }); 
     } 

     if ($(this).parent().position().left >= 700) { 
      $('.bio').css({  
       'height': $(this).height()+2, 
       right: $(this).parent().width() 
      }); 
     } 

     $(this).css({'background-color':'#55CADF'}); 

     $(this).siblings('.bio').animate(
      { width: '+=160px' }, 
      { easing: 'swing', complete: function() { $('.biotext').fadeIn(); } } 
     ); 
    //endmouseover 
    }, 

    function() { 

     $(this).css({'background-color':'#ffffff'}); 

     $(this).siblings('.bio').stop().hide().css({'width':'0px'}) 
     $('.bio').hide(); 
     $('.biotext').hide(); 

    }) 
    //end 

//enddocumentready 
}); 

你可以在這裏看到的頁面http://afhboston.com/artists_listnew.php

基本上，一旦我將鼠標懸停在這該元素的條件語句被忽略的地位已經不如在它的父項中大於700px，並且位置大於700px的元素向左移動到右側。我沒有什麼好運算出這個bug。

Answer 1

嘗試使用else而不是兩個ifs。我懷疑第二個條件總是成立，因爲你正在改變你正在檢查的內容。

if ($(this).parent().position().left <= 700){ 
    $('.bio').css({ 'height':$(this).height()+2,left:$(this).parent().width()}); 

    }else{ 

    $('.bio').css({ 'height':$(this).height()+2,right:$(this).parent().width()}); 
    }