用jquery插件-slider实现滑块的效果

原创 2012年03月29日 23:30:36
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>滑块的效果</title>
<!--引入jquery类库文件-->
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery-ui-1.8.18.custom.min.js"></script>
<!--引入css样式类库-->
<link rel="stylesheet" type="text/css" href="css/jquery-ui-1.8.18.custom.css" 

/>
<script>
$(document).ready(function(){
	$('#slider').slider({
		disabled:false,   //是否可用,true不可用  false即可用的
		animate:true,   //代表是采用动画效果
		//max:100,          //滑块的最大值是100
		min:-100,             //滑块的最小值
		value:0,             //滑块的默认值
		//orientation:'versvfvtical',   //滑块的方向是垂直的还是水平的

horizontal    
		values:[30,80],	         //初始化滑块的位置 一个是30 一个是80
		range:true,
		stop:function(event,ui){  //滑块的范围  执行绑定事件
		//	alert('停止的时候执行');
			}
		});
		//采用bind绑定的方式执行 event事件
		$('#slider').bind('stopslider',function(event,ui){
			//alert('开始执行');
			});
	});
</script>
</head>

<body>
<div>滑块效果</div>
<div id="slider" style="width:300px;"></div>
</body>
</html>


滑块控件 (Slider Control) 样式

Visual Studio .NET 2003滑块控件 (Slider Control) (CSliderCtrl) 可以为垂直方向或水平方向。它们可以在任何一边有、两边都有或两边都没有刻度线。它们也...
  • yy13210520
  • yy13210520
  • 2011年05月15日 15:36
  • 4479

Qt-QML-Slider-滑块-Style

感觉滑块这个东西,可以算是一个基本模块了,在我的项目中也有这个模块,今天我将学一下一下滑块的使用以及美化工作。 想学习滑块,那就要先建立一个滑块,新建工程什么的这里就省略了,不会的可以看我前面的几...
  • z609932088
  • z609932088
  • 2017年04月30日 23:25
  • 1355

jQuery UI 实例 - 滑块(Slider)实现

1)说明 实现滑动滑块选择数值 2)示例代码 滑块实现
  • kirsten_z
  • kirsten_z
  • 2017年10月24日 16:35
  • 346

WPF中Slider滑块的使用

首先,表示WPF界面设计和.net Framework3.0之前的拖控件,代码控制控件的位置的思路完全不同。 昨天老大让我把定时发送命令的时间由用户自己选择的功能做到界面上,用滑块,搞了半天还是没能...
  • wangsunjun
  • wangsunjun
  • 2012年04月26日 12:12
  • 3980

UISlider(滑块)控件的常用属性

UISlider控件的集成关系: UISlider:UIControl:UIView:UIResponder:NSObject 1、创建UISlider控件 2、设置UISlider控件的值、最大...
  • lover0920
  • lover0920
  • 2015年12月01日 15:14
  • 575

slider滑块用法

Slider用法: 1、设置、取得滑动范围:   void SetRange( int nMin, int nMax, BOOL bRedraw = FALSE );   void GetRan...
  • myyzqt
  • myyzqt
  • 2012年03月26日 20:08
  • 13623

jquery插件滑块效果的实现

下面代码实现了一个进度条的效果,其中列举出了一部分的方法 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www....
  • mengyun00
  • mengyun00
  • 2012年03月29日 19:09
  • 1204

Bootstrup增强版jQuery slider滑块插件

这是一款在原生bootstrup slider的基础上制作效果非常炫酷的jQuery slider插件。该slider插件可以自定义slider的颜色、形状、透明度和tooltip等属性,美化的效果非...
  • delmarks
  • delmarks
  • 2015年02月05日 12:18
  • 1459

iOS开发之可双向调节的Slider滑块

滑块在很多地方都有使用,所以这里向大家展示一个自定义的可双向控制的Slider,并且可以通过代理方法获取相应的范围值,部分代码如下:属性值:/** 设置最小值 */@property (nonatom...
  • hbblzjy
  • hbblzjy
  • 2017年03月21日 16:53
  • 1509

Qt5 双滑块支持float变化的控件,以及单滑块float控件,供大家参考

最近做到一个项目,需要设置一个参数的上下限,最开始考虑的办法是用QSlider控件来实现,发现有两个不太合适的地方。 一个参数需要用两个控件来设置,而且两者之间还有大小关系的限制,比较麻烦;QSl...
  • theoryll
  • theoryll
  • 2017年09月07日 09:56
  • 441
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用jquery插件-slider实现滑块的效果
举报原因:
原因补充:

(最多只允许输入30个字)