Не происходит замена картинок при помощи Java Script

Sumerki · №1

Работает в IE и OPERA, но не в FIREFOX:

имеем сайт http://iconstruct.nm.ru/_index.html
в нем меню. Картинки - паззлы, при наведении на блок div курсора заменяются на другие картинки, которые подгружаются при загрузке страницы:

Выделить код

Код:

<body onload="ImgPreload();">

.....

function ImgPreload() {
		pic1=new Image(); pic1.src='img/gearbutton1.jpg';	
		}

Замена картинок по событиям онмаусовер и онмаусаут происходит так:

Выделить код

Код:

function ImgOn1() { temp=but1.src; but1.src=pic1.src; }
         function ImgOff1() { but1.src=temp; }

На всякий случай привожу сам div целиком:

Выделить код

Код:

<a style="text-decoration:none; cursor: pointer" href="index.html"><div  onmouseover="ImgOn1();" onmouseout="ImgOff1();" class="divmenubuttonclass">
		 <img align="left" name="but1" src="img/gearbutton.jpg" />
		 <span class="bigclass">Проекты</span><i> портфолио, <span class="undertext">замыслы, идеи</span></i>	
		 </div> </a>

И на всякий случай полностью привожу скрипт:

Выделить код

Код:

<script language="JavaScript" type="text/javascript">

		function ImgPreload() {
		pic1=new Image(); pic1.src='img/gearbutton1.jpg';
		pic2=new Image(); pic2.src='img/projectbutton1.jpg';
		pic3=new Image(); pic3.src='img/mailbutton1.jpg';
		pic4=new Image(); pic4.src='img/infobutton1.jpg';		
		}

         function ImgOn1() { temp=but1.src; but1.src=pic1.src; }
         function ImgOff1() { but1.src=temp; } 
         function ImgOn2() { temp=but2.src; but2.src=pic2.src; }
         function ImgOff2() { but2.src=temp; } 
         function ImgOn3() { temp=but3.src; but3.src=pic3.src; }
         function ImgOff3() { but3.src=temp; } 
         function ImgOn4() { temp=but4.src; but4.src=pic4.src; }
         function ImgOff4() { but4.src=temp; } 		 		 
</script>

Где мой косяк?

Отредактировано Sumerki (12-09-2007 03:50:58)

Shutnik · №2

Sumerki
во первых, все переменные должны быть объявлены.
во вторых, все атрибуты name нужно заменить на id и обращаться к ним через document.getElementById(<id>), как этого требует спецификация js.
ну и в третьих, в Firefox имеется консоль ошибок...

Lynn · №3

А в-четвёртых, этот скрипт вообще нужно выкинуть.
Учите CSS
Fast Rollovers Without Preload
Google: CSS image rollover

Sumerki · №4

Всем большое спасибо!!!!
Если кому еще понадобится: http://www.htmlbook.ru/content/?id=110

ЗЫ. к сожалению, в моем случае учить CSS нельзя, я его итак знаю, надо просто чаще заставлять себя думать творчески

Отредактировано Sumerki (12-09-2007 12:38:55)

Полезная информация

№112-09-2007 03:49:50