Сообщение от Jakuzi
|
а как сделать для нескольких изображений?чтоб с различными интервалами появлялись?
|
учить js!!!
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<style type='text/css'>
.hide {
opacity: 0;
}
</style>
<script type='text/javascript'>
window.onload=function(){
function toggle(id, range)
{
range = range||[2,5];//2 сек картинка появляется, 5 сек исчезает
var image = document.getElementById(id),
i = 0, s = ["block","none"];
function show()
{
//image.style.display = s[i];
image.style.transition = 'all '+range[i]+'s';
image.style.webkitTransition = 'all '+range[i]+'s';
image.style.mozTransition = 'all '+range[i]+'s';
image.style.oTransition = 'all '+range[i]+'s';
image.className = i ? 'hide' : ''
setTimeout(show,range[i]*1000);
i ^= 1
}
show()
}
toggle('test')
toggle('ddd',[1,1])
toggle('bbb',[5,2])
}
</script>
</head>
<body>
<img id="ddd" src="http://javascript.ru/img/ws_1.png">
<img id="test" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif">
<img id="bbb" src="http://im31.gulfup.com/jus2H.jpg">
</body>
</html>