Question

在此示例中.. http://jsfiddle.net/PKFyV/

你可以看到我正在使用jquery ui来构建一个滑块。您可以上下拖动红色条以查看输入更改的值，但是当您这样做时，您会注意到红色图像保持其渐变透视图的问题。 Jquery设置了div的高度，所以当它非常小时，它使用图像的顶端，这是渐变的较轻端。我需要的是背景从底部开始并根据div的高度放大，以便当滑块设置为1或2时，底部条显示红色渐变图像的较暗端。有什么想法吗？

.ui-slider {
    position: relative;
    text-align: left;
}
#slider-vertical {
    background:url(http://qupload.com/images/ratingslid.png) no-repeat -30px 0;
    width:30px;
    height:161px;
}
.ui-slider-range {
    background:url(http://qupload.com/images/ratingslid.png) no-repeat 0 0;
    width:30px;
    height:161px;
}
.ui-slider-vertical .ui-slider-range-min {
    bottom: 0;
}
.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    border: 0;
}
.ui-slider-vertical .ui-slider-range {
    left: 0;
}

Answer 1

试试这个：

.ui-slider-range {
    background:url(http://qupload.com/images/ratingslid.png) no-repeat 0 bottom;
    width:30px;
    height:161px;
}

Demo

使图像背景从图像的底部开始

1 个答案: