[JS] Optymalizacja skryptu zmiany obrazka

[gryman]

Zrobilem stronke, na ktorej mam zakladki, jak sie na nie najedzie to obraz podmienia sie na inny (wysunietą zakladke). Problem w tym ze nie na wszystkich kompach przegladarki chca podczas najechania myszka zmienic mi jeden obraz na drugi. Dziwi mnie to dlatego ze to te same wersje przegladarek. Np. u mnie dziala na wszystkich (IE, Mozilla, Opera). Na innym kompie zkolei w IE chodzi a w operze nie. Na trzecim kompie znowu w operze chodzi a w IE nie. Wiem ze to nie kwestia Javy bo to co innego ale wszedzie jest zainstalowana (tak dla formalnosci). Chcialbym zoptymalizowac tą sprawe dla wszystkich przegladarek. Bez wzgledu na to czy maja poinstalowane jakies wtyczki czy inne pierdoly chce zeby obraz podmienial sie na kazdej przegladarce. Prosze o pomoc! Ponizej wklejam fragment źródła, ktory dotyczy zmiany obrazu. Czy cos jest w nim zle?

Z gory dzieki za odpowiedz pozdrawiam

W ramach head:

Kod: Zaznacz cały

 <script language="JavaScript">
      function movepic(img_name,img_src) {
      document[img_name].src=img_src;
      }
</script>

W ramach body:

Kod: Zaznacz cały

 <div style="position: relative; top: 115px;">		
            <A HREF="mailto:[email protected]" 
            onmouseover="movepic('button','pics/wysuniety6.jpg')" 
            onmouseout="movepic('button','pics/zakladka6.jpg')">
            <IMG NAME="button" SRC="pics/zakladka6.jpg" ALT="Kontakt" border="0" width="118" height="50" position></a>
          </div>

[Stig]

Jeżeli dobrze zrozumiałem Twoje intencje to ten sam efekt możesz uzyskać korzystając z CSS'owej pseudoklasy :hover. Dzięki temu powinieneś pozbyć się wszelkich napotkanych do tej pory problemów. Szczegółowo to zagadnienie starałem sie opisać w tym topicu.

[gryman]

dzieki bardzo za odpowiedz. a nie dalo by sie jednak jakos tego js zoptymalizowac ? bo nie bardzo rozumiem tej pseudo klasy :/ i nie wiem jakbym mial to podmienic...

[phpIker]

Ja polecam takie coś. Dziala pod każdą przeglądarka, uniwersalny i co najważniejsze sprawdzony.

JavaScript

Kod: Zaznacz cały

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

Przykład zastosowania:

Kod: Zaznacz cały

<a href="" onmouseover="MM_swapImage('index','','img/bt_index_on.jpg',1)" onmouseout="MM_swapImgRestore()"><img src="img/bt_index_off.jpg" alt="Index" id="index" /></a>

[Dawid Pytel]

Pierwsza wskazówka...

Kod: Zaznacz cały

document[img_name].src

Takei odnoszenie się do elementów w htmlu napewno nie działa pod każdą przeglądarką. Według zaleceń powinno się odwoływać przez użycie instrukcji:

Kod: Zaznacz cały

document.getElementById('TutajIdElementu').src

id elementu nadajesz piszą w np obrazku:

<img src="..." id="unikalnaNazwa">

Sproboj przerobic swoj skrypt.

[gryman]

ok poszlo dzieki bardzo !!
pozdrawiam