Question

需要淡化包含文本和图像的多个div元素，需要在无限淡化时淡化此div，如幻灯片放映。有人可以帮帮我吗？需要像这样： http://jsfiddle.net/garreh/JbrXd/

<div class="fios-cobre">
    <div id="first-content">
        ... 
    </div><!-- /#first-content -->
    <div id="second-content">
        ...
    </div><!-- /#second-content -->
</div><!-- /.fios-cobre -->

Answer 1

好的，下次先尝试自己的解决方案。但就目前而言，也许这会有所帮助..

HTML＆amp; CSS

<head>
<style>
div.fios-cobre {
position: relative;
}

div.fios-cobre > div {
position: absolute;
top: 0;
left: 0;
}
</style>
</head>

<body>
<div class="fios-cobre">
  <div id="first-content">
    first 
  </div><!-- /#first-content -->
  <div id="second-content">
    second
  </div><!-- /#second-content -->
  <div id="third-content">
    third
  </div><!-- /#second-content -->
</div><!-- /.fios-cobre -->

如果你想要（第一，第二，第三）

，图像也可以与文本一起进入

jquery的

$(document).ready(function(){
    $('div.fios-cobre div:gt(0)').hide();

    setInterval(function(){
    $('div.fios-cobre div:first-child').fadeOut()
        .next('div').fadeIn()
        .end().appendTo('div.fios-cobre');}, 
    3000);              
});

http://jsfiddle.net/54xkj/

淡化div元素无限

1 个答案: