[英]Customizing jQuery UI Slider height & width
When customizing the height/width of the jQuery UI Slider (and handle), the handle will now slide too far left (off of slider). 现在,自定义jQuery UI Slider(和手柄)的高度/宽度时,手柄将向左滑动太远(离开滑块)。 Is there a recommended way of going about doing this?
有推荐的方法来做到这一点吗?
Here's a fiddle to show you what I mean: http://jsfiddle.net/w7A4k/ 这是一个小提琴,向您展示我的意思: http : //jsfiddle.net/w7A4k/
I didn't see anything in the API Documentation for this, and I'm using a very basic setup: 我没有在API文档中看到任何内容,并且使用的是非常基本的设置:
$("#slider").slider({
orientation: "horizontal",
max: 100,
min: 0
});
Try 尝试
.ui-slider .ui-slider-handle {
height: 15px;
width: 5px;
padding-left: 5px; //add this
}
padding-left: 5px;
padding-left: 5px;
Unit size of JQuery UI Slider is in em
. JQuery UI Slider的单位大小以
em
。 Therefore slider size is relative to its font size. 因此,滑块大小与其字体大小有关。
$(document).ready(function() {
function home_page_banner_height(selector) {
var wind_widht = $( window ).width();
var req_height = ( (banner_height / banner_width) * 100 );
//banner_height is height of item div of carousel and banner_width is width of item div of caousel
var calculate_height = (wind_widht / 100) * req_height;
$('.v_center_con .v_center_inner').height(calculate_height);
$(selector).height(calculate_height);
}
home_page_banner_height('.banner_con .item');
$(window).resize(function() {
home_page_banner_height('.banner_con .item');
//this function will make your slider responsive for all screen sizes
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.