AnythingSlider：使Nav標籤無效？

Question

我使用的是AnythingSlider工具，並且在這方面對css和js有些麻煩。基本上，滑塊具有多個導航標籤，可幫助從幻燈片跳轉到幻燈片。我想改變這個，這樣當coldfusion條件運行時，某些選項卡將保持默認狀態或變爲不活動狀態（將選項卡的顏色更改爲灰色，當用戶單擊該選項卡時不會讓任何事情發生）。基本上，我的CF會像

<cfif #X# is ""> //if true, make tab #2 not clickable, change color to grey 
       //else, if false, keep tab normal. 

滑塊基本上是建立在HTML這樣的：

<ul> 
    <li></li> //slide #1 
    <li></li> //slide #2 etc etc 
</ul> 

我，也許我可以成立一個類裏CLASS =的想法「假「作爲例子，每個'幻燈片'有兩個li標籤（如果x是tr，則顯示一個）呃，其他如果不是）

所以，我不知道這是否有意義，但主要是，我需要一個手操縱CSS。滑塊標籤的代碼如下所示：

div.anythingSlider.activeSlider .thumbNav a.cur, div.anythingSlider.activeSlider .thumbNav a { 
    background-color: #7C9127; 
} 

UPDATE好了，我不明白這一點。這是我頁面末尾的代碼（就在結束BODY標記之前），我在那裏發佈了一些警告，以確保代碼能夠正常運行，但是沒有任何反應，Tabs不會變爲非活動狀態，顏色也不會改變。

我改變anythingslider.css包括這樣：

div.anythingSlider.activeSlider .thumbNav a.false, 
      div.anythingSlider.activeSlider .thumbNav a.false:hover { background: #555; } 

，這是我的主網頁的底部，這個腳本被包裹在一些CFOUTPUT標籤：

<cfif #selected_main_details.X# IS ""> 
     settab(3, false); 
    <cfelse> 
     settab(3, true); 
    </cfif> 

function settab(num, enable){ 
var panel = $('.thumbNav a.panel' + num); 
if (enable){ 
    panel 
    .removeClass('false') 
    .unbind('click') 
    .bind('click', function(){ 
    panel.closest('.anythingSlider').find('.anythingBase').data('AnythingSlider').gotoPage(num); 
    return false; 

    }) 
} else { 

    panel 
    .addClass('false') 
    .unbind('click focusin') 
    .bind('click', function(){      
    return false; 

    }) 

} 
} 

Answer 1

如果你想只需更改標籤顏色，使用此css

div.anythingSlider.activeSlider .thumbNav a.false, 
div.anythingSlider.activeSlider .thumbNav a.false:hover { background: #555; } 

如果您想實際禁用該選項卡，則需要多一點工作。我把這個功能放在一起來啓用或禁用特定的選項卡。授予此功能將打破該選項卡的哈希標記功能，並且不會禁用鍵盤或以該面板爲目標的任何腳本 - 這需要對插件進行一些更改（Demo）。

function settab(num, enable){ 
var panel = $('.thumbNav a.panel' + num); 
if (enable){ 
    panel 
    .removeClass('false') 
    .unbind('click') 
    .bind('click', function(){ 
    panel.closest('.anythingSlider').find('.anythingBase').data('AnythingSlider').gotoPage(num); 
    return false; 
    }) 
} else { 
    panel 
    .addClass('false') 
    .unbind('click focusin') 
    .bind('click', function(){ 
    return false; 
    }) 
} 
} 

使用上述功能如下

• 如果你有一個以上的AnythingSlider在頁面上，然後面板變量應與#slider針對特定滑塊被定義如下：

  var panel = $('#slider').closest('.anythingSlider').find('.thumbNav a.panel' + num); 
  

  如果只有一個，那麼這個較短的變量將工作

  var panel = $('.thumbNav a.panel' + num); 
  

• 禁用標籤如下：

  settab(3, false); 
  

• 啓用標籤如下：

  settab(3, true);