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

Question

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

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

我认为我可以更新行$('.node:lt(' + step + ')').opacity(ui.value -10);以降低顶部图像-10的不透明度，但是这不会起作用。

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

Answer 1

试试this。您需要使用.css('opacity',value)，因为没有.opacity()方法，并且该值应该是0到1之间的数字。

$('#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
    }
});