onmauseoverv i link

Ogłoszenie:

8 posty(ów) • Strona 1 z 1

onmauseoverv i link

przez karolkamyk 25 Lut 2007, 23:49

Aktualnie robie nową stronę swojej szkoły i mam problem z menu. Użyłem efektu onmouseover, tzn. kiedy najezdzam na obrazek wtedy on zmienia się na taki jaki chcę. To wygląda tak:

<div class="menu1"><img src="obrazki/menu.jpg" onmouseover="src='obrazki/menu_nad.jpg'" onmouseout="src='obrazki/menu.jpg'" border="0"></div>

Do tej pory wszystko jest ok ale gdy za pomocą css umiszcze na tym obrazku link tekstowy i najedę na ten link obrazek zachowuje się tak jakbym zdjął z nigo kursor. Chodzi mi o to żeby nie było zmiany po najechaniu na link. adres strony: http://www.gim1siem.yoyo.pl/ ma to wyglądać mniej wiecej jak na http://webtutorials.pl

karolkamyk

~user

Posty: 120

Dołączenie: 06 Mar 2006, 17:19

Miejscowość: Siemiatycze

Pochwały: 8

E-mail

Góra

przez skabszo 26 Lut 2007, 00:18

polecam Ci zapoznanie się z css, jest o wiele lepsze

http://riddle.jogger.pl/2005/08/25/efekt-rollover-w-css/
http://riddle.jogger.pl/2006/06/08/jeszcze-lepszy-efekt-rollover-w-css/

skabszo: ~user; Posty: 77; Dołączenie: 22 Cze 2005, 21:17; Pochwały: 2

Góra

przez @Marcin 26 Lut 2007, 14:24

TO jest strona w HTML'u? efekt (OnMousOver) u siebie rozwiazałem tak:

Kod: Zaznacz wszystko: ONMOUSEOVER="popup('Teskt','kolor ramki')"; ONMOUSEOUT="kill()"

w <head> wstaw:

Kod: Zaznacz wszystko: <STYLE TYPE="text/css">  </STYLE>

w <body>

Kod: Zaznacz wszystko: <DIV ID="dek"></DIV> <SCRIPT TYPE="text/javascript">  </SCRIPT>

możesz to jeszcze zmodyfikowac do potrzeb własnych

@Marcin

~user

Posty: 2296

Dołączenie: 19 Sty 2005, 08:55

Miejscowość: Jugów

Pochwały: 232

Góra

przez karolkamyk 26 Lut 2007, 16:47

@Marcin powiedz gdzie mam wstawic ten pierwszy kod bo jak wstawilem go w obrazku menu to pojawił mi się czarny prostokąt, a chodzi mi o to aby zrobic tak zeby tekst był wyswietlany ale był by jakby przezroczyst i nie reagował na najechanie myszką, tzn. ze kiedy najade na link który znajduje się na obrazku zmienił się obrazek pod tym linkiem

PS strona jest zrobiona w html ale ma drobne skrypty w php

karolkamyk

~user

Posty: 120

Dołączenie: 06 Mar 2006, 17:19

Miejscowość: Siemiatycze

Pochwały: 8

E-mail

Góra

przez zuo 26 Lut 2007, 20:11

@Marcin, loool nie ma to jak zamieszczac skrypty jeszcze z przed wojen przegladarek :lol:

tym bardziej jak sie na dobrą sprawe nie wie czego sluzą.

co do tematu, to zgadzam sie ze rollover lepiej w css'ie to robic

Twoj problem mozesz rozwiazac nadajac zdarzenia na calego diva a nie obrazek o ile dobrze zrozumialem

Tak wogole to ten kod z pierwszego tematu tez conajmniej "dziwny" ;]

Aha i ciekawi mnie jak mozna zamieszczac linki za pomocą css'a [smiech]

zuo: ~user; Posty: 30; Dołączenie: 11 Lut 2007, 16:29; Pochwały: 3

Góra

przez karolkamyk 26 Lut 2007, 20:21

zuo napisał(a):Aha i ciekawi mnie jak mozna zamieszczac linki za pomocą css'a [smiech]

Chodziło mi o wypozycjonowanie :roll:

zuo napisał(a):nadajac zdarzenia na calego diva a nie obrazek

obrazek i link są w dwóch różnych div'ach

<div class="menu1"><img src="obrazki/menu.gif" onmouseover="src='obrazki/menu_nad.gif'" onmouseout="src='obrazki/menu.gif'" border="0"></div>
<div class="dokumenty"><a href="dokumenty.html" target="iframe1">Dokumenty szkolne</a></div>

a puzniej w pliku css

.menu1 {position: absolute;
visibility: inherit;
top: 205px;
left: 0px;
}
.dokumenty {position: absolute;
visibility: inherit;
top: 240px;
left: 15px;
}

karolkamyk

~user

Posty: 120

Dołączenie: 06 Mar 2006, 17:19

Miejscowość: Siemiatycze

Pochwały: 8

E-mail

Góra

przez zuo 26 Lut 2007, 20:38

No to pseudoklasa hover.

Ewentualnie js:

Do czesci head:

Kod: Zaznacz wszystko: <script type="text/javascript"> function pokaz_tlo(cos) { document.getElementById("id_diva").style.background-Image=cos; } </script>

I do tego diva dodajesz jeszcze: