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

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.

JavaScript, porady

This entry was posted on Sunday, September 16th, 2007 and is filed under JavaScript. You can follow any responses to this entry through RSS 2.0. You can leave a response, or trackback from your own site.

Co piszą znajomi?

Biologia zazwyczaj nie opisuje systemów w kategoriach obiektów podlegających niezmiennym prawom fizycznym opisywanym przez matematykę. Układy biologiczne posiadają statystycznie przewidywalne tendencje do zachowywania się w określony sposób, lecz tendencje te zazwyczaj nie są tak konkretne jak te opisywane przez dyscypliny takie jak fizyka. Jednakże biologia nadal podlega tym samym prawom fizyki co reszta wszechświata, na przykład zasadom termodynamiki i prawu zachowania masy. Nauki biologiczne są charakteryzowane i ujednolicone przez poszczególne, podstawowe pojęcia takie jak uniwersalność, ewolucja, różnorodność, ciągłość, genetyka, homeostaza, wzajemne oddziaływanie.

Zimowy sezon w Białce Tatrzańskiej może być naprawdę tłoczny. Z wielu stron Polski przyjeżdża całe mnóstwo turystów, którzy chcą cieszyć się śnieżnym szaleństwem na stokach i spędzić tam swój urlop. Zimą Białka Tatrzańska przepełniona jest turystami, którzy niejednokrotnie już znacznie wcześniej muszą zadbać o swoje Noclegi Białka Tatrzańska . Turyści wybierają Białkę Tatrzańską z wielu względów. Niejednokrotnie mówi się o tym, że w mieście tym zima trwa znacznie dłużej, co jest oczywiście prawdą, ponieważ takie a nie inne uwarunkowania naturalne sprzyjają zatrzymywaniu się tam pokrywy śnieżnej.

#1 by nirvan on December 13th, 2009

dupa mi to nie działa, a wszystko mam dobrze

Quote

#2 by Bialy837 on January 11th, 2010

Bardzo fajny kodzik podoba mi się, działa

#3 by a on July 19th, 2010

Świetnie!! działa!!

#4 by Ziomek on September 8th, 2010

Świetne !! Działa mi to !!!

#5 by Krzysztof on February 14th, 2011

Zaletą tego aktywnego przycisku jest niesamowita wprost prostota. Na moim kompie działa świetnie!
Jednak po wysłaniu na serwer nie podmienia na obrazek (przycisk) alternatywny. Pokazuje, że obrazek powinien być, ale go nie wstawia. Dzieje się tak pomimo tego, że obrazek (przycisk) alternatywny “obrazek1.gif” jest także na tym serwerze w tym samym katalogu (!) co i plik strony “strona.html”.
Nie rozumiem dlaczego tak się dzieje.
Czy mógłby mi to ktoś objaśnić. Z góry dziękuję.

#6 by Krzysztof on February 14th, 2011

Przepraszam, że zawracałem głowę. Już zajarzyłem o co biega. Program graficzny, którego używałem do tworzenia plików “obrazek1.gif” dawał w efekcie pliki z rozszerzeniem *.GIF
Niby nic – ale serwer to rozróżnia (*.gif od *.GIF) w odróżnieniu od mojego własnego kompa.
Zmieniłem rozszerzenia plików (przycisków) na *.gif i po kłopocie.
Wszysko działa jak należy. POZDRO!

#7 by Foxis on October 18th, 2011

Jak mogę dodac napis ??

Porady IT