jQuery插件滑动器的使用 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'slider.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.7.1.min.js"> </script> <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-ui-1.8.18.custom.min.js"> </script> <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/ui-lightness/jquery-ui-1.8.18.custom.css"> <script type="text/javascript"> $(document).ready(function() { // Slider 滑动器的效果 $('#slider').slider( { range : true, // false则分为两个滑块，如果为false，则没有连着 表示可分的 ,默认为true 表示是否是一个整体 values : [ 17, 67 ],//两个滑块的长度 step:10,//每次增长的步 长 value:20,//为初始化值 ，为0居中，为默认的 disable:false,//是否可用 默认是false，可用的 animate:true, //点击滑块后面的任意位置，看滑块的效果 max:100,//滑动效果的最大值和最小值 min:-10,//打开的时候位置变了,初始值为0，如果-7是最小值,在左边+7的位置上，如果是居中的位置 最大值和最小值的绝对值相等 orientation:"horizontal",//水平或垂直 如果是水平(horizontal) ,垂直为 vertical change:function(event,ui){ //alert($("#slider").slider("option","value")); alert(ui.value); } }); /*$("#slider").bind("slidechange",function(event,ui){ alert(ui.value); });*/ }); </script> </head> <body> <h2> 滑动器的操作 </h2> <h2 class="demoHeaders"> Slider </h2> <div id="slider"></div> </body> </html>
jQuery插件滑动器的使用
内容版权声明：除非注明，否则皆为本站原创文章。
转载注明出处：http://127.0.0.1/wyypzj.html