jQuery jRange 是一個強大的滑塊選擇器插件,它可以方便地創建一個 interactive 范圍選擇拖動條。這個插件允許用戶在一定范圍內選擇任意的值,它支持豎直和水平兩個方向的拖動功能。
使用 jRange 插件的代碼非常簡單,您只需要引入 jQuery 庫和插件源文件即可。以下是一個基本的 jRange 應用示例:
<input class="range" type="range" name="range" /> <script src="jquery-3.6.0.min.js"></script> <script src="jquery.range.min.js"></script> <script> $(".range").jRange({ from: 0, to: 100, step: 1, scale: [0, 25, 50, 75, 100], format: "%s", width: 300, showLabels: true, isRange: true }); </script>
在上面的代碼中,我們設置了滑塊的起始值為 0,最大值為 100,步進值為 1,刻度標簽為 0、25、50、75 和 100。我們還設置了滑塊的寬度為 300 像素,同時顯示了標簽,還啟用了范圍選擇。
jRange 還支持一些其他的配置項,包括滑塊的顏色、選擇范圍、刻度標簽等等。這些配置項可以幫助您創建出更適合您應用需求的滑塊選擇器。
jRange 插件給我們提供了一個非常實用的工具,它可以輕松地創建復雜的滑塊選擇器。如果您需要一個滑塊選擇器,可以嘗試使用 jRange 插件。
下一篇網頁導航欄怎么做css