Непрофессиональное введение в JAVASCRIPT



             

Изменение изображений по событиям, инициированных пользователем - часть 2


// ok, we have a JavaScript browser var browserOK = false; var pics;

// --> </script>

<script language="JavaScript1.1"> <!-- hide

// JavaScript 1.1 browser - oh yes! browserOK = true; pics = new Array();

// --> </script>

<script language="JavaScript"> <!-- hide

var objCount = 0; // number of (changing) images on web-page

function preload(name, first, second) {

// preload images and place them in an array

if (browserOK) { pics[objCount] = new Array(3); pics[objCount][0] = new Image(); pics[objCount][0].src = first; pics[objCount][1] = new Image(); pics[objCount][1].src = second; pics[objCount][2] = name; objCount++; } }

function on(name){ if (browserOK) { for (i = 0; i < objCount; i++) { if (document.images[pics[i][2]] != null) if (name != pics[i][2]) { // set back all other pictures document.images[pics[i][2]].src = pics[i][0].src; } else { // show the second image because cursor moves across this image document.images[pics[i][2]].src = pics[i][1].src; } } } }

function off(){ if (browserOK) { for (i = 0; i < objCount; i++) { // set back all pictures if (document.images[pics[i][2]] != null) document.images[pics[i][2]].src = pics[i][0].src; } } }

// preload images - you have to specify which images should be preloaded // and which Image-object on the wep-page they belong to (this is the first // argument). Change this part if you want to use different images (of course // you have to change the body part of the document as well)

preload("link1", "img1f.gif", "img1t.gif"); preload("link2", "img2f.gif", "img2t.gif"); preload("link3", "img3f.gif", "img3t.gif");

// --> </script> <head>

<body> <a href="link1.htm" onMouseOver="on('link1')" onMouseOut="off()"> <img name="link1" src="link1f.gif" width="140" height="50" border="0"></a>




Содержание  Назад  Вперед