bxSlider - 僅在當前幻燈片上顯示動畫/ CSS？

我在我的WordPress主題中使用bxslider，並且一切看起來都很好，但是我想要做的只是將一些CSS應用於當前幻燈片。bxSlider - 僅在當前幻燈片上顯示動畫/ CSS？

我在我的頁面上有多個滑塊（wordpress循環中的每個帖子都會拉動一個滑塊並將它放在摘錄上方，我想要實現的是任何滑塊中的當前圖像都具有1的完全不透明度，作爲非當前圖像具有0.7mm

目前我一直在使用一些CSS實現了這一不透明和對bxslider查詢如下：

$(document).ready(function(){ 
    $('.bxslider').bxSlider({ 
      onSlideBefore: function (currentSlideNumber, totalSlideQty, currentSlideHtmlObject) { 
    $('img.attachment-thumbnail-size').removeClass('active'); 
    $('img.attachment-thumbnail-size').eq(currentSlideHtmlObject+1).addClass('active') 
    var current = $('img.attachment-thumbnail-size').attr('id'); 
    $('#team-member').load('load_member.php?id='+current); 
    } 
    }); 
})

但在循環這隻適用於第一個滑塊，第二個似乎並沒有通過外觀的東西來增加類別？

正在建設中可以看到http://google-boost.co.uk

謝謝！

來源

2013-09-29 fish_r

我已經詳細介紹此鏈接http://stackoverflow.com/questions/18351541上回答了這個問題/ target-active-slide-and-add-css-class/18357158＃18357158檢查它，如果我的解決方案可以幫助不要忘記upvote。 – MarsOne

嘿MarsOne，對於那個隊友乾杯，但我仍然有一些問題，這個問題似乎更多與頁面上的滑塊的其他實例，第一個滑塊工作正常，但由於有多個滑塊，它doesn似乎沒有提供這些信息，只是將其他人的圖像不透明度設置爲.7 –

這可能是關於類名的一個問題。你有沒有嘗試通過ID而不是類來引用滑塊。給你的2個滑塊獨特的ID，然後在你的JS編寫2個方法的2個ID ... – MarsOne

這裏只是一個想法如何，必須工作（未測試）

但這個想法，你需要單獨的onSliderLoad（這將是第一張幻燈片）和onSlideBefore（這應該作品每一張幻燈片）。請參閱我的函數的參數，我使用bxSlider V4.1.1，所以你需要更新您的當前版本

$(document).ready(function(){ 
    $('.bxslider').bxSlider({ 
    onSliderLoad: function($slideElement, oldIndex, newIndex){ 
     var cur = $('ul.bxslider').find('li:eq('+($slideElement+1)+')'); 
     var current = cur.find('img.attachment-thumbnail-size'); 
     current.addClass('active'); 
     $('#team-member').load('load_member.php?id='+current.attr('id')); 
    }, 
    onSlideBefore: function($slideElement, oldIndex, newIndex){ 
     $('img.attachment-thumbnail-size').removeClass('active'); 
     var cur = $('ul.bxslider').find('li:eq('+($slideElement+1)+')'); 
     var current = cur.find('img.attachment-thumbnail-size'); 
     current.addClass('active'); 
     $('#team-member').load('load_member.php?id='+current.attr('id')); 
    } 
    }); 
})

來源

2013-12-17 10:42:07 fatwp

bxSlider - 僅在當前幻燈片上顯示動畫/ CSS？

回答

相關問題