jQuery：在滿足條件後更改類

Question

我創建了這個site，其中您有多個滑塊垂直移動使用此示例在> stackoverflow>here <以及此fiddle。

加載的網站有一個溢出：隱藏在我的主要內容div (div class="content-fs row")的身體和位置上。這個想法是，當你第一次到達頁面時，你滾動瀏覽每張幻燈片，一旦你點擊最後一張幻燈片，主要內容div (div class="content-fs row")上的位置從固定變爲靜態，溢出：隱藏從主體中移除。我在編寫條件語句時遇到了麻煩，說「如果它是最後一個滑塊，請更改位置」。下面的jquery是我用於網站的代碼以及不起作用的條件語句。

任何指針/意見將不勝感激！

的jQuery：

function scrollLax(){ 
/* 
initialize 
*/ 
var scrollDown = false; 
var scrollUp = false; 
var scroll = 0; 
var $view = $('#portfolio'); 
var t = 0; 
var h = $view.height() - 250; 


    $view.find('.portfolio-sliders').each(function() { 
    var $moving = $(this); 
      // position the next moving correctly 
     if($moving.hasClass('from-bottom')) { 
      $moving.css('top', h); // subtract t so that a portion of the other slider is showing 
     } 
    // make sure moving is visible 
    $moving.css('z-index', 10); 
    }); 
var $moving = $view.find('.portfolio-sliders:first-child'); 
     $moving.css('z-index', 10); 

/* 
event handlers 
*/ 

var mousew = function(e) { 
    var d = 0; 
    if(!e) e = event; 
    if (e.wheelDelta) { 
     d = -e.wheelDelta/3; 
    } else if (e.detail) { 
     d = e.detail/120; 
    } 
    parallaxScroll(d); 
} 
    if (window.addEventListener) { 
     window.addEventListener('DOMMouseScroll', mousew, false); 
    } 
    window.onmousewheel = document.onmousewheel = mousew; 
/* 
parallax loop display loop 
*/ 
window.setInterval(function() { 
    if(scrollDown) 
    parallaxScroll(4); 
    else if(scrollUp) 
    parallaxScroll(-4); 
}, 50); 

function parallaxScroll(scroll) { 
    // current moving object 
    var ml = $moving.position().left; 
    var mt = $moving.position().top; 
    var mw = $moving.width(); 
    var mh = $moving.height(); 
    // calc velocity 
    var fromBottom = false; 
    var vLeft = 0; 
    var vTop = 0; 
    if($moving.hasClass('from-bottom')) { 
     vTop = -scroll; 
     fromBottom = true; 
    } 
    // calc new position 
    var newLeft = ml + vLeft; 
    var newTop = mt + vTop; 
    // check bounds 
    var finished = false; 
    if(fromBottom && (newTop < t || newTop > h)) { 
     finished = true; 
     newTop = (scroll > 0 ? t : t + h); 
    } 

    // set new position 
    $moving.css('left', newLeft); 
    $moving.css('top', newTop); 
    // if finished change moving object 
    if(finished) { 
     // get the next moving 
     if(scroll > 0) { 
      $moving = $moving.next('.portfolio-sliders'); 
      if($moving.length == 0) 
       $moving = $view.find('.portfolio-sliders:last'); 
       //this is where I am trying to add the if conditional statement. 
       if ('.portfolio-sliders:last') 
        $('.content-fs.row').css({'position': 'static'}); 
        if('.portfolio-sliders:last' && (mt == 0)) 
         $('html, body').removeClass('overflow'); 
     } else { 
      $moving = $moving.prev('.portfolio-sliders'); 
      if($moving.length == 0) 
       $moving = $view.find('.portfolio-sliders:first-child'); 
      //reverse the logic and if last slide change position 
       if('.portfolio-sliders:first-child') 
       $('.content-fs.row').css({'position': 'fixed'}); 
      } 

    } 
     // for debug 
    //$('#direction').text(scroll + "/" + t + " " + ml + "/" + mt + " " + finished + " " + $moving.text()); 

} 

} 

Answer 1

您的代碼，因爲它只是詢問.portfolio-sliders:last是否存在。似乎你應該這樣做：

if ($moving == $('.portfolio-sliders:last')) 

或沿着這些行東西，而不是檢查活動幻燈片是否是最後一個。