jquery - jquery 滑块 - 在图像之间滑动，将不透明度从 100 设置为 0

Question

我正在尝试使用 jquery 滑块从 1-100 滑动并将 4 个图像的不透明度设置在彼此之上。

到目前为止，这是我的代码：http: //jsfiddle.net/AtaMQ/目前已损坏

我想我可以更新这条线$('.node:lt(' + step + ')').opacity(ui.value -10);以降低顶部图像的不透明度 -10 沿着滑动条的每一步，但这不起作用。

我应该使用透明度，还是这也不正确？

Answer 1

试试这个。您需要使用.css('opacity',value)，因为没有.opacity()方法，并且值应该是介于零和一之间的数字。

$('#slider').slider({
    min: 0,
    range: "max",
    max: 1,
    step: 0.01,
    slide: function(event, ui) {
        $('.node').removeClass('highlight');
        var step = Math.floor(ui.value + .5);
        $('.node').css('opacity', 1-ui.value); // from 1 to 0 instead of 0 to 1
    }
});