0

因为所有图像都有不同的角度并且都是透明的,所以你可以看到它们都在彼此后面。有没有办法只让顶部图像可见而其余图像被隐藏?我可以隐藏 .js 文件或 .css 中的图像吗?

我仍然希望图像是透明的,现在我刚刚添加了一个背景来隐藏所有图像。

所以我想我怎样才能让幻灯片中的图像保持透明,但不显示它背后的图像。

http://kennenmen.netai.net/test.php

function slideSwitch() {
var $active = $('#slideshow IMG.active');

if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

var $next =  $active.next().length ? $active.next()
    : $('#slideshow IMG:first');

$active.addClass('last-active');

$next.css({opacity: 1.0})
    .addClass('active')
    .animate({opacity: 1.0}, 1000, function() {
        $active.removeClass('active last-active');
    });
}

$(function() {
setInterval( "slideSwitch()", 400 );
});


    <div id="slideshow">
<img src="http://images.lasuni.com/users/5/0/kennen.png" alt="" class="active" />
<img src="http://images.lasuni.com/users/2/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/8/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/4/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/6/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/3/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/7/0/kennen.png" alt="" />
<img src="http://images.lasuni.com/users/1/0/kennen.png" alt="" />
</div>
4

2 回答 2

0
function slideSwitch() {
    var $active = $('#slideshow img.active');
    if ($active.is(':last')) {
        $active.hide().removeClass('active');
        $('#slideshow img:first').show().addClass('active');
    }else{
        $active.hide().removeClass('active').next().show().addClass('active');
    }
}

$(function () {
    $('#slideshow img').not('.active').hide()
    setInterval(slideSwitch, 400);
});

小提琴

于 2013-04-06T23:43:27.487 回答
0

为了避免丢失一张图片,我不得不将最后一个答案的第三行更改为

if ($active.is(':nth-last-child(1)')) {
于 2014-10-19T18:45:58.727 回答