使用javascript条件语句的jquery

时间:2011-07-26 04:08:07

标签: 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的元素将向右移动,而不是左侧。我没有抓住这个错误的运气。

1 个答案:

答案 0 :(得分:0)

尝试使用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()});
    }