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);