2012-03-29 50 views
0

我有下面的代碼爲滑塊,現在我需要添加和刪除元素使用最大值和最小值的CSS。Jquery添加和刪除類使用滑塊

這是我有:

$("#audioslider").slider({ 
     orientation: "vertical", 
     range: "min", 
     min: 0, 
     max: 100, 
     value: 60, 
     slide: function(event, ui) { 
      var value = $("#audioslider").slider("value"); 
      document.getElementById("audio").volume = (value/100); 
      if(value == 0){ 
      $('.volumeon').addClass('volumeoff') 
      }else if(value >= "max"){ 
      $('.volumeon').addClass('volumeon') 
      } 
     } 
    }); 

,如果它分鐘的添加類,但不添加如果低於最低值。 那我該怎麼做?

+0

如果您向.volumeon添加一個volumeon類,它將不會執行任何操作,因爲該類必須位於此處以便您選擇該元素。您需要刪除'off'類。 – 2012-03-29 19:58:48

+0

@馬修 - 我也嘗試過這種方式,但要麼不適用。 – coder 2012-03-29 20:08:23

+0

對不起!我有一個垂直滑塊的問題,我已經將它改爲horizo​​ntal.Now它工作正常。 – coder 2012-03-29 21:10:36

回答

1

你的意思是這樣嗎?

if(value < 1){ 
    $('.volumeon').addClass('volumeoff'); 
    $('.volumeon').removeClass('volumeon'); 
}else { 
    $('.volumeoff').addClass('volumeon'); 
    $('.volumeoff').removeClass('volumeoff'); 
} 
+0

@ safarov-你的方法很接近,但是一旦它應用了,其他時間就沒有了。 – coder 2012-03-29 20:10:05

+0

嘗試'價值<1' – safarov 2012-03-29 20:11:40

+0

更新的代碼,檢查 – safarov 2012-03-29 20:19:42

1

它看起來大多喜歡一個錯字 - 你在與文本「最大」,而不是一個變量與value。只要改變該行

}else if (value == 100){

+0

@安迪 - 你是對的我試圖申請,但它沒有工作,後來改變了這種方式,但也是一樣的。 – coder 2012-03-29 20:09:24

1

好像所述邏輯有點過。

如果值大於等於100,那麼音量就會打開,如果是0則關閉?如果音量大於0,音量會不會上升?

正如Andy所提到的,您將var值與字符串「max」進行比較,而不是作爲滑塊屬性的實際預期最大值。

在任何情況下與給定的邏輯。你需要在'volumeOn'上做一個刪除類,並在值等於0時添加'volumeOff'類。當值> = 100時,你需要做相反的操作,刪除'volumeOff'並添加'volumeOn'。

本質上是這一點的代碼。

if(value == 0){ 
    $('.volumeon').addClass('volumeoff').removeClass('volumeon'); 
} else if(value >= 100){ 
    $('.volumeoff').addClass('volumeon').removeClass('volumeoff'); 
}