Porady IT

Jak zrobić przycisk zmieniający się po najechaniu na niego myszką?

Sep 16

Wielokrotnie widziałeś zapewne na stronach WWW menu z przyciskami graficznymi, które zmieniają się gdy najedziemy na nie kursorem myszki. Wbrew pozorom takie menu jest bardzo proste do wykonania.

Na początku powinieneś przygotować sobie dwie grafiki - guzik w postaci normalnej i guzik alternatywny, który będzie wyświetlany, gdy najedziemy na niego kursorem myszki. Nazwij grafiki odpowiednio g1.gif i g2.gif i umieść je w katalogu ze stroną, na której mają się wyświetlać.

Następną rzeczą, jaką powinieneś zrobić, to wkleić na stronę poniższy kod.

<A href="strona.html"> <IMG src="g1.gif" border="0" alt="opcja1" onmouseover="this.src='g2.gif'" onmouseout="this.src='g1.gif'"> </A>

Jak zapewne zauważyłeś, grafika ma przypisane dwie akcje - onmouseover (gdy kursor jest nad nią) i onmouseout (gdy kursor opuszcza jego obszar) i w zależności od akcji, pokazywany jest inny obrazek.

Jeżeli chciałbyś zbudować całe menu takich przycisków, wystarczy, że powielisz kilka razy cały przedstawiony powyżej kod i utworzysz odpowiednią ilość przycisków.

Podziel się z innymi: Te ikonki pozwalają łatwo podzielić się tym artykułem z innymi za pośrednictwem serwisów społecznościowych