逻辑错误

Question

在这种jfiddle

http://jsfiddle.net/ezanker/fRb9L/2/

当“三”，而观看标签＃会以正确的方式标签＃3

滑动点击但是当我点击在观看水龙头＃3时“同一”，它仍会沿相同的方向滑动。我想让它向相反的方向滑动。

问题来自这部分？

if (!$(href).is(":visible")) 
{ 
     var dirclass = reverse == true ? " reverse" : ""; 

或者这部分代码？

$(this).removeClass(trans + " in" + dirclass); 

此源代码的哪部分必须改变才能解决该问题？感谢堆栈溢出

Answer 1

您的reverse变量无助于确定在点击过程中应选择哪个方向。

您应该比较之前选择的元素和您选择的元素。基于href串

比较它看起来像：

Fiddle。

$(".tabBtn").on("click", function(){ 
    var selectedHref = $('.ui-btn-active').prop("href"); 
    selectedHref = selectedHref.substr(selectedHref.lastIndexOf("#")); 
    $(".tabBtn").removeClass("ui-btn-active"); 
    $(this).addClass("ui-btn-active"); 
    var trans = $(this).data("transition"); 
    var href = $(this).prop("href"); 
    href = href.substr(href.lastIndexOf("#")); 
    if (!$(href).is(":visible")){ 
     var dirclass = href < selectedHref ? " reverse" : ""; 
     ... 

基于HTML结构：

Fiddle。

$(".tabBtn").on("click", function(){ 
    var selected = $('.ui-btn-active'); 
    $(".tabBtn").removeClass("ui-btn-active"); 
    $(this).addClass("ui-btn-active"); 
    var trans = $(this).data("transition"); 
    var href = $(this).prop("href"); 
    href = href.substr(href.lastIndexOf("#")); 
    if (!$(href).is(":visible")){ 
     var dirclass = $(this).parent().nextAll().find(selected).length ? " reverse" : ""; 
     ...