Question

Jquery循环使用z-index和opacity来更新当前图像

z-indexes是：1,2,3,4，...

我需要-1，-2，-3，-4，-5，......（负）

这是我在这里看到的与z-index相关的唯一代码http://toniweb.us/gm/js/cycle.js

$.fn.cycle.transitions = {
    fade: function($cont, $slides, opts) {
        $slides.not(':eq(0)').hide();
        opts.cssBefore = { opacity: 0, display: 'block' };
        opts.cssAfter  = { display: 'none' };
        opts.animOut = { opacity: 0 };
        opts.animIn = { opacity: 1 };
    },
    fadeout: function($cont, $slides, opts) {
        opts.before.push(function(curr,next,opts,fwd) {
            $(curr).css('zIndex',opts.slideCount + (fwd === true ? 1 : 0));
            $(next).css('zIndex',opts.slideCount + (fwd === true ? 0 : 1));
        });
        $slides.not(':eq(0)').hide();
        opts.cssBefore = { opacity: 1, display: 'block', zIndex: 1 };
        opts.cssAfter  = { display: 'none', zIndex: 0 };
        opts.animOut = { opacity: 0 };
    }
};

我试图改变+ by - 但它似乎继续以相同的方式工作..

$.fn.cycle.transitions = {
    fade: function($cont, $slides, opts) {
        $slides.not(':eq(0)').hide();
        opts.cssBefore = { opacity: 0, display: 'block' };
        opts.cssAfter  = { display: 'none' };
        opts.animOut = { opacity: 0 };
        opts.animIn = { opacity: 1 };
    },
    fadeout: function($cont, $slides, opts) {
        opts.before.push(function(curr,next,opts,fwd) {
            $(curr).css('zIndex',opts.slideCount - (fwd === true ? 1 : 0));
            $(next).css('zIndex',opts.slideCount - (fwd === true ? 0 : 1));
        });
        $slides.not(':eq(0)').hide();
        opts.cssBefore = { opacity: 1, display: 'block', zIndex: -1 };
        opts.cssAfter  = { display: 'none', zIndex: 0 };
        opts.animOut = { opacity: 0 };
    }
};

任何想法如何？

顺便说一句

$(curr).css('zIndex',opts.slideCount - (fwd === true ? 1 : 0));

这意味着opts.slideCount-1如果fwd == true而opts.slideCount + 1如果为false，对吧？

Answer 1

尝试将其更改为：

$(curr).css('zIndex', '-' + (opts.slideCount + (fwd === true ? 1 : 0)));
$(next).css('zIndex', '-' + (opts.slideCount + (fwd === true ? 0 : 1)));

将JQuery循环z-index置为负值

1 个答案: