MozillaPL.org - polskie centrum Mozilli

autor: **Refrex** » 22 czerwca 2006, 10:43

Jak zrobić, by po najechaniu kursorem na jakiś obrazek, zmieniał się on na inny obrazek?

autor: **riddle** » 22 czerwca 2006, 13:05

Kod: Zaznacz cały: <body> <img src="pierwszy.gif" height="50" id="top" alt="" /> .. content .. <img src="drugi.gif" height="50" id="bottom" alt="" /> </body> body { margin: 0; padding: 50px 0; background: url(trzeci.gif) 0 50px no-repeat; } #top, #bottom { width: 100%; display: block; position: absolute; left: 0; border: 0; } #top { top: 0; } #bottom { bottom: 0; }

autor: **Refrex** » 22 czerwca 2006, 13:16

To nie działa ani na IE ani na FF

autor: **riddle** » 22 czerwca 2006, 19:04

Zdefiniuj nie działa. Ja pisałem z głowy.

autor: **Refrex** » 22 czerwca 2006, 20:50

Fragment kodu HTML:
Jeżeli miałbyś czas, to moze stwórz stronę, taką o jaką mi chodzi. Byłbym bardzo wdzięczny, a nigdy nie zgadniesz do czego planuje to wykorzystać

Kod: Zaznacz cały: <body onLoad="" style="font-size=12px; background-color:#4c71b8;"><style type="text/css"> html {height:100%;background-image: url(start.gif); background-repeat: repeat-x;background-position: bottom; margin:0px; background-color:#4c71b8;} </style> <img src="pierwszy.gif" height="50" id="top" alt="" /> .. content .. <img src="drugi.gif" height="50" id="bottom" alt="" /> body { margin: 0; padding: 50px 0; background: url(trzeci.gif) 0 50px no-repeat; } #top, #bottom { width: 100%; display: block; position: absolute; left: 0; border: 0; } #top { top: 0; } #bottom { bottom: 0; }

autor: **Tomek** » 23 czerwca 2006, 06:48

Jesli to jest twój fragment kodu, z jednego pliku... to masz błąd poważny - wkleiłeś częśc dotyczącą stylu poza head (w body).
ten fragment

Kod: Zaznacz cały: body { margin: 0; padding: 50px 0; background: url(trzeci.gif) 0 50px no-repeat; } #top, #bottom { width: 100%; display: block; position: absolute; left: 0; border: 0; } #top { top: 0; } #bottom { bottom: 0; }

wklej po <style type="text/css"> i powinno zadziałać.
Zresztą - najlepiej podaj adres strony - będzie nam łatwiej wychwycić o co chodzi

autor: **Refrex** » 23 czerwca 2006, 11:40

Nie działa

http://orland.ovh.org/

autor: **Tomek** » 23 czerwca 2006, 11:50

nie czytasz tego co się do ciebie mówi - dalej masz część odpowiedzialną za css w body! ma być przed body, w head!!!!
A zamiast tych dwóch obrazków daj diva z background-image w css

/// edit

poprzednio ci źle podałem bo nie wczytałem się w ten koszmarny kod

css musisz mieć przed body (wydawało mi się że takiego błędu nie da się zrobić)

autor: **Refrex** » 23 czerwca 2006, 11:55

Tylko, że ten pomysł nie wypali, ponieważ na IE i FF inaczej kolory wygladają i ta "luka" jest widoczna na FF, a na IE nie.
Ponieważ ma to tak wygladać: http://images3.fotosik.pl/90/5b74b0a0e48aa2aa.png A na każdej przegladarce ta luka między obrazkami jest widoczna lub nie.
Czy da się temu jakoś zaradzić?

autor: **Tomek** » 23 czerwca 2006, 12:05

masz grafikę w png, więc masz świadomość że IE ma z tym formatem wielkie problemy - źle ustawia sobie gammę. http://pobox.com/~jason1/tweakpng/ - to narzędzie pozwala na usunięcie tego problemu - wystarczy usunąć parametr gamma - wtedy już png są wyświetlane tak samo.
tak szczerze mówiąc... wydaje mi się że nie do końca wiesz co chcesz uzyskać i wg mnie używasz złej metody. zamiast img jako top i bottom zastosuj divu i ostyluj je odpowiednio.
I lukę ma tutaj IE a nie FF

autor: **Refrex** » 23 czerwca 2006, 12:07

Bawiłem się tym kodem i css, jednak jeszcze bardziej nakopciłem

Nigdy nie budowałem strony opartej na stylach, więc dlatego mam problemy.
Strone podałem, jednak nie mam zielonego pojęcia co jak poprzestawiać by działało.
Zgadza się, chciałbym by te obrazki były tłem, a nie grafiką, jednak tutaj kłania się niewiedza o css. Może dziwić, ze biorę się za budowę strony, który zabłyśnie, nie znając podstaw HTMl, ale teraz jest już za późno na naukę a czas goni.
Jeżeli ktoś zna się świetnie na css i umiałby to zrobić, byłbym bardzo wdzięczny gdyby mi w tym pomógł. Postaram się jakoś odwięczyć

autor: **Tomek** » 23 czerwca 2006, 12:37

hehe - czasu nikt nie wygrał na loterii - ale kto wie - może ktoś się znajdzie...
ja osobiście przez najbliższy tydzień nie mam czasu... wiec nie dam rady pomóc... (hm...ale czy ja się znam na css??

)
A poza tym - w sieci masz kursy html i one naprawdę są tak pisane, żeby nawet laik je liznął. Tym bardziej że wydaje mi się że to będzie prosta stronka...
Zauważ - nie odesłałem cię do specyfikacji (a powinienem) ale do kursu html. www.kurshtml.boo.pl - poczytaj - to 1 noc a na 100% się przyda

w razie konkretnych problemów (ale takich naprawdę konkretnych) wal na prv.

ps. a może nvu ci pomoże w tworzeniu????

autor: **Refrex** » 23 czerwca 2006, 12:55

Poradziłem sobie bez css. Zajrzyj na stronę www.refrex.info i sprawdź czy wszystko jest w porządku i czy poprawnie się wyświetla

Gdy ujrzysz kod HTMl wszystkiego się dowiesz

autor: **Tomek** » 23 czerwca 2006, 13:04

koszmarny kod....
masz dalej podstawowe błędy - to że to się wyświetla to ... cud?
Dla mnie nic w tym kodzie nie jest w porządku - tłumaczyłem ci już gdzie umieścić styl (przed body, w sekcji head).
ucieczka w iframe jest żadnym rozwiązaniem...
IMO nic nie jest w porządku...

autor: **Refrex** » 23 czerwca 2006, 14:34

Zrobiłem tak jak mówiłeś:
Czy to jest już poprawne? Nie ma fragmentów meta, bo zostały wycięte. Strona wyświetla sie jak marzenie. Po prostu miodzio

Kod: Zaznacz cały: <html> <head> <style type="text/css"> body { margin: 0; padding: 50px 0; background: url(trzeci.gif) 0 50px no-repeat; } #top, #bottom { width: 100%; display: block; position: absolute; left: 0; border: 0; } #top { top: 0; } #bottom { bottom: 0; } </style> </head> <body> <img src="pierwszy.gif" height="50" id="top" alt="" /> .. content .. <img src="drugi.gif" height="50" id="bottom" alt="" /> </body> </html>

autor: **riddle** » 23 czerwca 2006, 15:23

Geez, przez x postów mówiliśmy Ci co masz zrobić - ja podałem wieki temu poprawny CSS - zrobiłeś to wreszcie w mękach i dziwisz się że jednak to się robi tak? I jeszcze czy poprawnie?

Proszę Cię, zainwestuj czas i naucz się pisać strony.

autor: **Refrex** » 23 czerwca 2006, 15:33

Jak zrobić, by po najechaniu kursorem na jakiś obrazek, zmieniał się on na inny obrazek?
I czy taki kod jest zawsze skuteczny i zawsze zadziała?

autor: **riddle** » 23 czerwca 2006, 18:48

Nowy temat -> nowy post, nikt ci nie odpowie póki nie będziesz przestrzegał paru zasad. I zmień tytuł tego wątku z powrotem. To nie dżungla.

EoT.

autor: **Refrex** » 23 czerwca 2006, 18:58

Racja, temat do zamknięcia

MozillaPL.org - polskie centrum Mozilli

Główne menu:

[CSS] zmiana obrazka na inny pod kursorem

[CSS] zmiana obrazka na inny pod kursorem

Kto jest online

Nawigacja:

Stopka: