jQuery यूआई स्लाइडर

दिखाई नहीं दे मैंने सोचा था कि एक स्लाइडर के लिए बुनियादी वाक्यविन्यास था:jQuery यूआई स्लाइडर

<div id="slider"></div> 

$("#slider").slider()

लेकिन वह एक दृश्य स्लाइडर नहीं है। div तत्व का निरीक्षण करते हुए, मुझे लगता है कि कुछ स्टाइलिंग लागू की गई थीं, लेकिन स्लाइडर दिखाई नहीं दे रहा है।

यहाँ एक बेला है: http://jsfiddle.net/yqNcn/

स्रोत

2012-04-10 Tyler DeWitt

अच्छा, jQuery यूआई डेमो कॉपी किया गया, और यह काम नहीं कर रहा है। मैं केवल अनुमान लगा सकता हूं कि jsfiddle गड़बड़ हो गया। – sg3s

आप jQuery यूआई के लिए सीएसएस शामिल नहीं किया है तो कक्षाएं ही लागू है लेकिन शैलियों नहीं हैं (वहाँ वास्तव में लागू करने के लिए कोई भी कर रहे हैं)। Here's एक संपादित पहेली जिसमें शैलियों को शामिल किया गया है (संसाधन पैनल देखें); स्लाइडर दिखता है क्योंकि यह होना चाहिए।

स्रोत

2012-04-10 22:35:12 Jon

यह अजीब बात है, jsfiddle उस परवाह नहीं करता है भले ही आपने jQuery UI चेकबॉक्स की जांच की हो? या तो एक बग या वास्तव में सोचा नहीं है ... jQuery यूआई जेएस कोड से अधिक है। – sg3s

पहले आयात अपने जावास्क्रिप्ट फ़ाइलें * jquery.s और आयात jQuery के यूआई विजेट Jquery-ui.js फिर अपने CSS आईडी<div id="slider"></div> इस उदाहरण

<div id="slider"></div>

तो कॉल jQuery स्लाइडर समारोह के साथ डिव टैग रखो ....

<script> 
$(function() { 
$("#slider").slider(); 
}); 
</script>

स्रोत

2014-02-27 17:34:32

-1

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 


<script> 
    $(function() { 
    $("#slider-range").slider({ 
     range: true, 
     min: 1000, 
     max: 1000000, 
     values: [ 75000, 300000 ], 
     slide: function(event, ui) { 
     $("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]); 
     } 
    }); 
    $("#amount").val("$" + $("#slider-range").slider("values", 0) + 
     " - $" + $("#slider-range").slider("values", 1)); 
    }); 
    </script> 
</head> 
<body> 

<p> 
    <label for="amount">Price range:</label> 
    <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;"> 
</p> 

<div id="slider-range"></div>

स्रोत

2017-05-02 15:03:47 chheky

jQuery यूआई स्लाइडर

उत्तर

संबंधित मुद्दे