jQuery的滑塊控件背景 - 改變dynamicaly

我使用自定義的背景爲我的滑塊通過重寫CSS：jQuery的滑塊控件背景 - 改變dynamicaly

$(document).ready(function() { 
    $(".myslider5").slider({ 
     animate: "true", 
     step: 1, 
     min: -1950, 
     max: 1950, 
     value: 0, 
     slide: function(event, ui) { 
       // magic happens here 
     } 
    }); 
    $(".myslider3").slider({ 
     animate: "true", 
     step: 1, 
     min: -1350, 
     max: 1350, 
     value: 0, 
     slide: function(event, ui) { 
       // magic happens here 
     } 
    });

所以，myslider5和myslider3是：

.ui-widget-content {background: transparent url(../img/bg.png) no-repeat;}

Slider的行爲受到控制這兩個班。但是他們的背景圖像需要不同。我如何去做這件事？

來源

2010-05-02 publicRavi

更新：

DEMOhttp://jsbin.com/itivu3

SOURCEhttp://jsbin.com/itivu3/edit

注：採取記住你有什麼要求，change image dynamically on slide!!!

來源

2010-05-02 23:49:11

這與我想達到的目的相反。對不起，解釋不好。我正在嘗試爲每個滑塊類使用不同的背景。 – publicRavi 2010-05-02 23:58:03

這只是一個概念證明！它只是你想要的！只需單獨使用！看到我的更新！ – 2010-05-03 00:09:57

我想通了。出於某種原因，aSeptik的建議不起作用。它必須在CSS部分而不是在JS中進行調整。

.myslider5.ui-widget-content {background: transparent url(../img/slider5.png);} 
.myslider3.ui-widget-content {background: transparent url(../img/slider3.png);}

來源

2010-05-03 19:22:19 publicRavi

它正在工作罰款花花公子！問題是我已經使用了你提供給我的CSS！只需使用'url（../ img/myslider5.png）'而不是 'url（../ img/myslider5.png）no-repeat;'查看更新！ – 2010-05-03 20:30:39

並請檢查答案！ ;-）謝謝！ – 2010-05-03 20:32:37

@aSeptik不，我必須用上面的行更新CSS文件，而不是JS文件。 – publicRavi 2010-05-04 01:08:05

jQuery的滑塊控件背景 - 改變dynamicaly

回答

相關問題