| zzMaddyzz |
06.03.2015 00:26 |
Слайдер,работающий при изменении размеров окна.
Доброго времени суток.Недавно в js, посему требуется ваша помощь.Необходимо написать код ,который бы переключал картинки при изменении пользователем размеров окна.Все на что меня хватило,это переключть две картинки:( (код прилагается). Никак не пойму как отследить каждое изменение окна.Если продолжать пилить условия,то все меняется мгновенно(setTimeout не заюзать), пробовал делать в цикле, но у нубца все залагало.Возможно надо по-другому вызывать функцию? В общем буду крайне признателен любой помощи.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>My Test Project</title>
<style>
#slider{
position: relative;
}
#slider img{
position: absolute;
}
</style>
<script type="text/javascript">
function slideShow(){
var globalImg = document.getElementsByTagName('img');
globalImg[3].style.opacity="0";
globalImg[2].style.opacity="1";
}
</script>
</head>
<body onresize="slideShow();">
<div id = "slider">
<img id = "1" src="img/1.gif" alt=""/>
<img id = "2" src="img/2.gif" alt=""/>
<img id = "3" src="img/3.gif" alt=""/>
<img id = "4" src="img/4.gif" alt=""/>
</div>
</body>
</html>
|