![Rozwiń skrzydła w branży IT [Książki drukowane -35%| Ebooki -50%]](https://static01.helion.com.pl/helion/img/promocje/bannery/20491/Helion_rozwin_skrzydla_w_bran_Rpolony_f7c3c9fea_1180x419.jpg)
Zmiana obrazka po najechaniu myszą (dynamiczne przyciski)
Skrypt zmienia obrazek po najechaniu na niego myszą wykorzystując do tego zdarzenie onMouseOver i onMouseOut.
Aby skrypt zadziałał do katalogu w którym odpalasz skrypt dodaj dwa obrazki o nazwie
obrazek1_on.gif i obrazek1_off.gif
Listing
<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-2">
<SCRIPT LANGUAGE= "JavaScript" type= "text/javascript">
<!-- Ukrycie przed przeglądarkami nie obsługującymi JavaScript
obrazek1_on = new Image(100, 50);
obrazek1_on.src = "obrazek1_on.gif";
obrazek1_off = new Image(100, 50);
obrazek1_off.src = "obrazek1_off.gif";
function img_act(pic)
{
document[pic].src = eval(pic + "_on.src");
}
function img_deact(pic)
{
document[pic].src = eval(pic + "_off.src");
}
// Koniec kodu JavaScript -->
</SCRIPT>
</HEAD>
<BODY>
<IMG
NAME="obrazek1"
SRC="obrazek1_off.gif"
onMouseOver="img_act('obrazek1')"
onMouseOut="img_deact('obrazek1')"
>
</BODY>
</HTML>
Dodano przez: igor
Ranga: Administrator serwisu Punktów: 0
Ranga: Administrator serwisu Punktów: 0
Komentarze użytkowników
A jak to zrobić by wiele obrazków na jednej stronie działało? Jak Robie jeden to mi chodzi a jak dwa to tylko dalej jeden chodzi, albo ten albo ten. Wszystkie na raz nie chodzą
autor: terlik87@interia.pl | 50 | 2009-01-14 13:23:01
Proste np mam trzy buttony obrazek1 obrazek2 obrazek3
- Zobacz kod dodany do tego wpisu
-
obrazek1_on = new Image(100, 50);
obrazek1_on.src = "obrazek1_on.gif";
obrazek1_off = new Image(100, 50);
obrazek1_off.src = "obrazek1_off.gif";
obrazek2_on = new Image(100, 50);
obrazek2_on.src = "obrazek2_on.gif";
obrazek2_off = new Image(100, 50);
obrazek2_off.src = "obrazek2_off.gif";
obrazek3_on = new Image(100, 50);
obrazek3_on.src = "obrazek3_on.gif";
obrazek3_off = new Image(100, 50);
obrazek3_off.src = "obrazek3_off.gif";
// a tu 3 obrazki
<IMG
NAME="obrazek1"
SRC="obrazek1_off.gif"
onMouseOver="img_act('obrazek1')"
onMouseOut="img_deact('obrazek1')"
>
<IMG
NAME="obrazek2"
SRC="obrazek2_off.gif"
onMouseOver="img_act('obrazek2')"
onMouseOut="img_deact('obrazek2')"
>
<IMG
NAME="obrazek3"
SRC="obrazek3_off.gif"
onMouseOver="img_act('obrazek3')"
onMouseOut="img_deact('obrazek3')"
>
-
autor: Igor | 51 | 2009-01-14 21:29:53
szkoda tylko, że to nie działa pod IE, wywala błąd :|
autor: SzukamRozwiązania | 82 | 2009-02-02 14:08:58
Sprawdź dokładnie konsole firebuga czy nie informuje o jakiś błędach, i czy jest poprawny kod JavaScript
autor: Igor | 83 | 2009-02-02 19:13:08
A jak to zrobić na przykładzie div?
.menu_gorne_ofirmie{
width: 137px;
height: 129px;
position: relative;
background: url(img/marian_11.jpg);
float:left;
}
autor: norr | 271 | 2009-06-17 21:51:27
-
-
Tre¶æ komentarza
-
:: Losowe artykuły
:: Wymiana linków
Modowe inspiracje |
Android Gry i Aplikacje |
ZaplanujTransport.pl: Przeprowadzki, transport, aukcje |
Logo dla firmy |
Change Tires - Car Weather Forecast Reminder |
Laminas: MVC Framework for PHP |
IT Books Reviews and Programming: JS, JAVA, PHP, ANDROID, CSS |
Katalog roślin |
Programming articles: JAVA, PHP, C++, Python, JavaScript |
Kancelaria Adwokacka Łukasz Huszno
