Onmouseover i iframe


(wojtek1150) #1

Witam,

Mam pewien problem.

Otóż mam parę obrazków i są to odsyłacze, jednak nie do nowej karty tylko do ramki.

Normalnie działa w ten sposób, iż po kliknięciu w ramce otwiera się strona, jednak nie oto chodzi. I tu pojawia się moje pytanie.

Czy da się zrobić tak, aby po najechaniu na obrazek, zmieniał on swój wygląd ( podmiana obrazka ) oraz bez kliknięcia do ramki ładowała się strona?

Jeśli tak, to prosiłbym o jakieś instrukcję na ten temat.

Pozdrawiam


(manieKMP) #2

W css'ie istnieje taka pseudoklasa akcji jak "hover", która po najechaniu na obiekt z nią, ma wykonywać określone rzeczy. Przykładowo, "a:hover {color: yellow;}" spowoduje, że po najechaniu kursorem na odnośnik tekstowy, jego tekst zmieni się na żółty kolor... to samo stanie się gdy określisz obrazek zamiast koloru.

Nie za bardzo rozumiem, ale w tym wypadku chyba nie obędzie się bez skryptu lub czegoś w tym stylu:

odnośnik[/code]

[code]odnośnik


(wojtek1150) #3

Strona jest w html5 wiec zastanawia mnie czy taki sam skrypt będzie działał w tej wersji, bo inaczej się go zapisuje :stuck_out_tongue:

Myślę, że dałoby się w takim wypadku chyba połączyć, bo z css'a wiem jak podmienić obrazek na hoverze, jednak w html wiem tylko jak podmienić obrazek po najechaniu. Tak więc pytanie, czy ta druga opcja co podałeś sprawdzi się w html5 i nie będzie crashować na innych przeglądarkach.

-- Dodane 22.11.2012 (Cz) 17:23 --

W cssie np tak:

header

{

border: 1px solid #CCCCCC;

border-radius: 5px;

background-image: url("header.png");

background-position: top left;

background-repeat: no-repeat;

}

header:hover

{

box-shadow: 0px 0px 15px #FF9900;

background-color: #FFFFBF;

background-repeat: repeat;

background-color: #fff;

}

-- Dodane 22.11.2012 (Cz) 20:56 --

Zrobiłem to takim sposobem:

*.html

Product one

[/code] *.css
[code]#product_one { position:relative; height:44px; width:370px; left:-20px; margin-top:-10px; } #product_one:hover { position:relative; height:44px; width:370px; font-weight: bold; background: url("images/benefit_active.png") 0 50%; }

Wszystko działa, jednak mam jedno pytanie. Da się wyłączyć "klikanie"? chodzi mi o to, że gdy ktoś najedzie to się wszystko elegancko zmienia, ale może w to kliknąć i tu jest problem bo przenosi go do strony z ramki


(Konradnie1) #4

Jeśli nie chcesz żeby przenosiło na daną strone to usuń to:

href="link.html"

(wojtek1150) #5

No tak, ale wtedy mi nie wczyta do ramki strony.

Bo z tym mam tak:

Po najechaniu:

*zmienia się tło

*do ramki (iframe) wczytuje się strona link.html

Po kliknięciu:

*przenosi do strony link.html

I nie chcę tego kliknięcia. Tylko żeby były akcję po najechaniu. I tu mam problem


(Konradnie1) #6

Nie znam js ale chyba da się zapisać w js strone:

Product one

[/code]
[code]top.frames['table'].location=this.href
Domyślam się ze

this.href

pobiera wartość z href='' tak wiec spróbuj zamiast tego wpisać link.html.

Jak pisałem nie znam js więc nie gwarantuje ze tak będzie działało ale spróbować mozesz.


(manieKMP) #7

Próbowałeś dopisać do tagu odnośnika "polecenie" onclick="return false" lub onclick="this.removeAttribute('href')"?

Przykład

Product one

[/code]


(wojtek1150) #8

Dzięki onclick="return false" pomogło

Pozdrawiam