Главная » 2010 » Май » 1 » Анимированный фон страницы (Javascript)
01.05.2010, 14:50

Анимированный фон страницы



На фоне странице, плавно, поочередно будут появляться четыре изображения (в данном случае девушки). Естественно, картинки вы можете изменить на свои, но чтобы не вносить изменения в скрипт, они должны иметь названия: 1.jpg, 2.jpg, 3.jpg и 4.jpg

В head вставляем это:

Code

<script language=javaScript>
<!-- Beginning of JavaScript -

img0 = new Image();
img0.src = "1.jpg";

img1 = new Image();
img1.src = "2.jpg";

img2 = new Image();
img2.src = "3.jpg";

img3 = new Image();
img3.src = "4.jpg";

var i_strngth=1
var i_image=0

var imageurl = new Array()
imageurl[0] ="1.jpg"
imageurl[1] ="2.jpg"
imageurl[2] ="3.jpg"
imageurl[3] ="4.jpg"

function showimage() {  
  if(document.all) {
  if (i_strngth <=80) {
  testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
  i_strngth=i_strngth+3
  var timer=setTimeout("showimage()",400)
  }  
  else {
  clearTimeout(timer)
  var timer=setTimeout("hideimage()",1000)
  }
  }  
   
  if(document.layers) {
  clearTimeout(timer)
  document.testimage.document.write("<img src="+imageurl[i_image]+" border=0>")
  document.close()
  i_image++
  if (i_image >= imageurl.length) {i_image=0}  
  var timer=setTimeout("showimage()",2000)
   
  }  
}

function hideimage() {  
  if (i_strngth >=-3) {
  testimage.innerHTML="<img style='filter:alpha(opacity="+i_strngth+")' src="+imageurl[i_image]+" border=0>";
  i_strngth=i_strngth-4
  var timer=setTimeout("hideimage()",400)
  }  
  else {
  clearTimeout(timer)
  i_image++
  if (i_image >= imageurl.length) {i_image=0}
  i_strngth=1
  var timer=setTimeout("showimage()",500)  
  }
}

// - End of JavaScript - -->
</script>

В body добавляем onload:

Code
<body onLoad="showimage()">

и вставляем это:

Code
<div id="testimage" style="position:absolute;visibility:visible;top:0px;left:0px"></div>
Материал взят с сайта infoscript.ru
Теги: Скачать Анимированный фон страницы
Скачать "Анимированный фон страницы"
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: Неизвестен
Категория: JavaScript's | Просмотров: 5175 | Добавил: antisept | Рейтинг: 4.0/2 |
Теги: фон, анимированный, страницы
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]