在兩個單獨的點擊功能上替代css更改

我試圖使用兩個點擊元素來影響特定元素的CSS更改，其中每個點擊元素都會影響不同的CSS更改，具體取決於我希望更改的元素的CSS屬性。在兩個單獨的點擊功能上替代css更改

我可以在首次點擊元素上使用if else語句應用這些更改，但是當我添加第二個點擊功能時，它無法工作。然而，兩個點擊功能單獨工作，但只有第一個作品。

任何人都可以看到我要去鏈接的JSFiddle錯了嗎？

JSFiddle of what I have so far

來源

2015-10-07 Gary Voss

更好地發佈您的代碼而不是JSFiddle鏈接。 –

@GaryVoss：** [This]（http://jsfiddle.net/tahirahmed/r98c28Lc/）**是我能夠利用** [TweenMax]（http：// greensock。 COM/GSAP）**。 –

您有語法錯誤。

$('.next').click(function() { 
     if($('.a').css('left') == '0px') { 
      $(".a").animate({left: "105px", top: "0px", width: "150px", height: "100px"}); 
     } 
     else if ($('.a').css('left') == '105px') { 
      $(".a").animate({left: "260px", top: "25px", width: "100px", height: "50px"}); 
     } 
    }); 

    $('.prev').click(function() { 
     if($('.a').css('left') == '105px') { 
      $(".a").animate({left: "0px", top: "25px", width: "100px", height: "50px"}); 
    } 
    else if ($('.a').css('left') == '260px') { 
     $(".a").animate({left: "105px", top: "0px", width: "150px", height: "100px"}); 
    } 
});

http://jsfiddle.net/v84cfcu0/1/

來源

2015-10-07 10:36:15 Omidam81

謝謝Omidam81。這很好。 –

你明白了:)但是這樣可以解決問題 – perseusl

也謝謝你:) – Omidam81

你有一個語法錯誤。

你有（$）;在每個點擊事件結束時。

它看起來像這樣：

})($);

你不需要($);看起來應該像下面這樣：

});

這裏顯示更新的代碼：

$('.next').click(function() { 
    if($('.a').css('left') == '0px') { 
     $(".a").animate({left: "105px", top: "0px", width: "150px", height: "100px"}); 
    } 
    else if ($('.a').css('left') == '105px') { 
     $(".a").animate({left: "260px", top: "25px", width: "100px", height: "50px"}); 
    } 
}); 

$('.prev').click(function() { 
    if($('.a').css('left') == '105px') { 
     $(".a").animate({left: "0px", top: "25px", width: "100px", height: "50px"}); 
    } 
    else if ($('.a').css('left') == '260px') { 
     $(".a").animate({left: "105px", top: "0px", width: "150px", height: "100px"}); 
    } 
});

JSFIDDLE FIX

來源

2015-10-07 10:41:07

在兩個單獨的點擊功能上替代css更改

回答

相關問題