私は生意気だと思って、 だけで「スライダー」を作りました.each
。
ここにあります: http://liebdich.biz/ .
クライアントは、元のフラッシュ アニメーション ( http://blanc-encens.com/ ) のように効果を望んでいます。
次の画像 (ここでインデックスを使用する方法) をフェードインするにはどうすればよいですか?
ここにコード:
<style>
ul.list {
list-style-type: none;
}
html, body {
height: 100%;
}
.content {
margin:0 auto;
position: relative;
top:50%;
height:841px;
margin-top:-420px;
width:1190px;
overflow: hidden;
}
</style>
</head>
<body>
<div class="content">
<ul class="list">
<li><img src="1.jpg" /></li>
<li><img src="2.jpg" /></li>
<li><img src="3.jpg" /></li>
<li><img src="4.jpg" /></li>
</ul>
</div>
<script>
$(window).load(function() {
function fade(){
$('ul.list li').each(function( i ){
if (i<3) {
$(this).delay(i*5000).fadeOut(2000);
}
});
}
setTimeout(fade, 5000);
});
</script>
</body>