标签:
var slider = { init: function () { slider.pc(); slider.phone(); }, //回调 callback: function (_doc, val) { var _item = _doc.find("span"); //拖拽元素 //格式化数值 var _max = parseInt(_doc.attr(‘data-max‘)); _max = !!_max ? _max : 100; var _min = parseInt(_doc.attr(‘data-min‘)); _min = !!_min ? _max : 0; var proportion = (_doc.width() - _item.width()) / (_max - _min); //显示结果 var maxVal = _doc.width() - _item.width(); var minVal = 0; val = val >= maxVal ? maxVal : val; val = val <= minVal ? minVal : val; var temp = parseInt((val) / proportion); temp = temp < 0 ? 0 : temp; //以下可以自定义 temp为实际数值,val为滑块移动的像素(相对拖拽区域的偏移量) _doc.closest(‘span‘).siblings(‘i‘).text(temp); _item.css(‘left‘, val + "px"); }, //pc端事件 pc: function () { $(".round").mousedown(function () { var _doc = $(this); document.onmousemove = function (e) { e = e || window.event; var val = e.clientX - _doc.offset().left; slider.callback(_doc, val); } document.onselectstart = function () { return false; } document.onmouseup = function () { document.onmousemove = null; document.onmouseup = null; } }); }, phone: function (e) { $(‘body‘).on(‘touchmove‘, ".round", function (e) { e.preventDefault();//阻止触摸时浏览器的缩放、滚动条滚动 var _doc = $(this); var val = e.originalEvent.touches[0].clientX - _doc.offset().left; slider.callback(_doc, val); }); } }; slider.init();
标签:
原文地址:http://www.cnblogs.com/muwei/p/4738823.html