基于jquery實現(xiàn)鼠標左右拖動滑塊滑動附源碼下載
更新時間:2015年12月23日 14:54:07 投稿:mrr
這篇文章主要介紹了基于jquery實現(xiàn)鼠標左右拖動滑塊滑動附源碼下載 的相關(guān)資料,需要的朋友可以參考下
在沒步入正文之前,先給大家貼效果圖,看看是不是您想要的效果:
基于jQuery移動端滑塊拖動設(shè)置代碼。這是一款支持手機移動端的特效,可拖動滑塊范圍選擇器,拖動滑塊數(shù)值選擇器。
廢話不多說了,直接給大家貼代碼了。
html代碼:
<div class="demo"> <input type="hidden" class="single-slider" value="0" /> <!-- <button id="g1">獲取值</button> --> </div> <div class="demo"> <input class="range-slider" type="hidden" value="10,89" /> <!-- <button id="g2">獲取值</button> --> </div>
js代碼:
$(function () { $('.single-slider').jRange({ from: 0, to: 100, step: 1, scale: [0, 25, 50, 75, 100], format: '%s', width: 300, showLabels: true, showScale: true }); $('.range-slider').jRange({ from: 0, to: 100, step: 1, scale: [0, 25, 50, 75, 100], format: '%s', width: 300, showLabels: true, isRange: true }); $("#g1").click(function () { var aa = $(".single-slider").val(); alert(aa); }); $("#g2").click(function () { var aa = $(".range-slider").val(); alert(aa); }); });
相關(guān)文章
jQuery動畫出現(xiàn)連續(xù)觸發(fā)、滯后反復(fù)執(zhí)行的解決方法
這篇文章主要介紹了jQuery動畫出現(xiàn)連續(xù)觸發(fā)、滯后反復(fù)執(zhí)行的解決方法,實例分析了針對jQuery中slideUp、slideDown、animate等動畫運用時出現(xiàn)的滯后反復(fù)執(zhí)行等問題的解決方法,需要的朋友可以參考下2015-01-01jquery+ashx無刷新GridView數(shù)據(jù)顯示插件(實現(xiàn)分頁、排序、過濾功能)
最近做一個AJAX的GridView來顯示數(shù)據(jù),當然按照現(xiàn)在流行的首選是Jquery。2010-04-04跟我一起學(xué)寫jQuery插件開發(fā)方法(附完整實例及下載)
jQuery如此流行,各式各樣的jQuery插件也是滿天飛。你有沒有想過把自己的一些常用的JS功能也寫成jQuery插件呢?如果你的答案是肯定的,那么來吧!和我一起學(xué)寫jQuery插件吧!2010-04-04jQuery使用getJSON方法獲取json數(shù)據(jù)完整示例
這篇文章主要介紹了jQuery使用getJSON方法獲取json數(shù)據(jù),結(jié)合完整實例形式分析了getJSON方法讀取與遍歷json文件數(shù)據(jù)的相關(guān)技巧,需要的朋友可以參考下2016-09-09