/**
* 小圆点滑动
* @param {目标dom} barEle
* @param {最小值} min
* @param {最大值} max
* @param {dom总长度} domLang
* @param {小圆点大小} circleWidth
*/
function sliderBar(barEle, min, max, domLang, circleWidth) {
let circleLeft;
if($(barEle).data('val') > max) {
circleLeft = domLang - circleWidth / 2 + 'px'
} else if($(barEle).data('val') < min) {
circleLeft = - circleWidth / 2 + 'px'
} else {
circleLeft = ($(barEle).data('val') - min) * (domLang / (max - min)) - circleWidth / 2 + 'px';
}
return circleLeft;
}
$('.circle').css({
left: sliderBar('.circle', 40, 160, 260, 60)
})

jquery 根据后端传过来的value值,让小原点根据不同值区间去左右定位的更多相关文章

  1. JQuery文件上传插件JQuery.upload.js的用法简介

    JQuery文件上传插件,这个插件很小,用法很简单,效果却很棒.注意:JQuery版本要求1.8及以上,大家执行如果没效果,则检查JQuery版本,如果是1.8及以上,则该插件源码中的.size()需 ...

  2. jquery 根据后台传过来的值动态设置下拉框、单选框选中

    更多内容推荐微信公众号,欢迎关注: jquery  根据后台传过来的值动态设置下拉框.单选框选中 $(function(){ var sex=$("#sex").val(); va ...

  3. 聊一聊jquery文件上传(支持多文件上传)

    谈到文件上传,现在一般都用现成的组件可以使用.PC端的可以使用uploadify.针对微网站H5也有uploadifive.但是这组件并不能满足各种场景的需求,例如:预览 切图 放大缩小,取消之类的. ...

  4. Spring MVC之中前端向后端传数据

    Spring MVC之中前端向后端传数据和后端向前端传数据是数据流动的两个方向, 在此先介绍前端向后端传数据的情况. 一般而言, 前端向后端传数据的场景, 大多是出现了表单的提交,form表单的内容在 ...

  5. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  6. 强大的支持多文件上传的jQuery文件上传插件Uploadify

    支持多文件上传的jQuery文件上传插件Uploadify,目前此插件有两种版本即Flash版本和HTML5版本,对于HTML5版本会比较好的支持手机浏览器,避免苹果手机Safari浏览器不支持Fla ...

  7. jQuery文件上传插件Uploadify(转)

    一款基于flash的文件上传,有进度条和支持大文件上传,且可以多文件上传队列. 这款在flash的基础上增加了html5的支持,所以在移动端也可以使用. 由于官方提供的版本是flash免费,html5 ...

  8. jquery.uploadify上传文件配置详解(asp.net mvc)

    页面源码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  9. jquery文件上传控件 Uploadify

    (转自 http://www.cnblogs.com/mofish/archive/2012/11/30/2796698.html) 基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同 ...

随机推荐

  1. C++线性表的链式存储结构

    C++实现线性表的链式存储结构: 为了解决顺序存储不足:用线性表另外一种结构-链式存储.在顺序存储结构(数组描述)中,元素的地址是由数学公式决定的,而在链式储存结构中,元素的地址是随机分布的,每个元素 ...

  2. std::string::insert函数

    string& insert (size_t pos, const string& str); string& insert (size_t pos, const string ...

  3. 练习,自定义TextView(1.1)

    重新自定义TextView是非常有趣的事情,跟着Android4高级编程,通过自定义TextView,来敲一下代码: 这个是那么的简单,自定义TextView,新建CustomTextView继承Te ...

  4. 记录:如何使用ASP.NET Core和EnityFramework Core实现服务和数据分离

    前情提要: 现有一个网站框架,包括主体项目WebApp一个,包含 IIdentityUser 接口的基架项目 A.用于处理用户身份验证的服务 AuthenticationService 位于命名空间B ...

  5. C#——继承

    在某基类中声明 virtual 并在一个或多个派生类中被重新定义的成员函数称为虚函数. 虚函数的作用就是实现多态性(Polymorphism),多态性是将接口与实现进行分离. C#作为完全面向对象语言 ...

  6. 用python代替人脑运算24点游戏

    前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:老方玩编程 PS:如有需要Python学习资料的小伙伴可以加点击下方链 ...

  7. L9循环神经网络进阶 ModernRNN

    GRU RNN存在的问题:梯度较容易出现衰减或爆炸(BPTT) ⻔控循环神经⽹络:捕捉时间序列中时间步距离较⼤的依赖关系 RNN: Ht=ϕ(XtWxh+Ht−1Whh+bh) H_{t} = ϕ(X ...

  8. vue中SPA的优缺点和理解

    说说你对SPA的理解,他的优缺点分别是什么? SPA(single-page application) 尽在Web页面初始化时加载相应的HTML,JavaScript和CSS.一旦页面加载完成,SPA ...

  9. [linux][nginx] 通过nginx扩展nginx-rtmp-module简单做了一个流媒体直播

    做的过程出现很多问题,环境其实就需要nginx就可以,然后就是在播放的问题,m3u8的格式,mac直接访问就支持,苹果系统原生H5支持m3u8,还有就是手机直接访问也支持!但是其他其他系统PC端不支持 ...

  10. kafka高吞吐量之消息压缩

    背景 保证kafka高吞吐量的另外一大利器就是消息压缩.就像上图中的压缩饼干. 压缩即空间换时间,通过空间的压缩带来速度的提升,即通过少量的cpu消耗来减少磁盘和网络传输的io. 消息压缩模型 消息格 ...