Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [HTML][CSS] Div zmieniający img w sobie.
gentleman
post 24.05.2013, 20:44:39
Post #1





Grupa: Zarejestrowani
Postów: 41
Pomógł: 1
Dołączył: 17.05.2013

Ostrzeżenie: (0%)
-----

Witam, od kilkudziesięciu minut próbuje zrobić diva który zamieni mi img1 na img2 po najechaniu na tego diva.

czy mógłby ktoś skrócić moje wypociny i wspomóc mnie ? i czy w ogóle jest to możliwe??

Ten post edytował gentleman 24.05.2013, 20:50:48
Go to the top of the page
+Quote Post
in5ane
post 24.05.2013, 21:18:38
Post #2





Grupa: Zarejestrowani
Postów: 1 335
Pomógł: 34
Dołączył: 9.11.2005
Skąd: Wrocław

Ostrzeżenie: (10%)
X----

Dopiero 10 tematów temu pisałem komuś coś podobnego, zerknij tutaj.


--------------------
> > > Tworzenie stron < < <
Go to the top of the page
+Quote Post
gentleman
post 24.05.2013, 21:28:52
Post #3





Grupa: Zarejestrowani
Postów: 41
Pomógł: 1
Dołączył: 17.05.2013

Ostrzeżenie: (0%)
-----

Ja nie chce najeżdżać na img tylko na div,a on ma zmienic img na inny.
tu masz przykład:


umiałbyś zrobić cos takiego?

Ten post edytował gentleman 24.05.2013, 21:30:45
Go to the top of the page
+Quote Post
Mega_88
post 24.05.2013, 21:46:55
Post #4





Grupa: Zarejestrowani
Postów: 360
Pomógł: 34
Dołączył: 20.08.2011

Ostrzeżenie: (0%)
-----

Proszę:
[HTML] pobierz, plaintext 
  1. $("#id-diva").hover(function() { $("#id-obrazka").fadeIn(100); }, function() { $("#id-obrazka").fadeOut(50); });
[HTML] pobierz, plaintext


W css te same pozycje dla obrazków, z-index dla każdego inny i po wszystkim

Ten post edytował Mega_88 24.05.2013, 21:47:47
Go to the top of the page
+Quote Post
Dominis
post 24.05.2013, 22:32:05
Post #5





Grupa: Zarejestrowani
Postów: 77
Pomógł: 19
Dołączył: 13.02.2010

Ostrzeżenie: (0%)
-----

Do tego nie potrzebujesz uzywać js(jquery)

[HTML] pobierz, plaintext 
  1. div.obrazek {
  2.       height: 30px;
  3.       width: 30px;
  4.       background: url(link do obrazka.jpg) no-repeat;
  5. }
  6.  
  7. div.obrazek:hover{
  8.       background: url(link do obrazka po najchaniu) no-repeat;
  9. }
[HTML] pobierz, plaintext


do teog mozna jakas animacje dodac w css3 wink.gif
height i width podany orientacyjnie..


--------------------
www.maxcode.pl
Go to the top of the page
+Quote Post
gentleman
post 25.05.2013, 10:09:45
Post #6





Grupa: Zarejestrowani
Postów: 41
Pomógł: 1
Dołączył: 17.05.2013

Ostrzeżenie: (0%)
-----

dlaczego podczas wykonywania się pętli działa mi to tylko przy pierwszym questionmark.gif a nie przy wszystkich.

Ten post edytował gentleman 25.05.2013, 10:10:24
Go to the top of the page
+Quote Post
jepek
post 25.05.2013, 11:01:36
Post #7





Grupa: Zarejestrowani
Postów: 55
Pomógł: 10
Dołączył: 12.08.2007

Ostrzeżenie: (0%)
-----

Najlepiej zrezygnować z img na rzecz diva, który za tło będzie miał sprite z obrazkiem w dwóch stanach - po hover i bez hover. W przypadku najechania na div div z obrazkiem powinien zmienić swoje background-position.

Oto przykład: http://jsfiddle.net/jepek/tXLfG/

Jeżeli chciałbyś uzyskać tu jakieś efekty użyj np. jQuery.
Go to the top of the page
+Quote Post
gentleman
post 25.05.2013, 11:55:24
Post #8





Grupa: Zarejestrowani
Postów: 41
Pomógł: 1
Dołączył: 17.05.2013

Ostrzeżenie: (0%)
-----

jesteś boski exclamation.gif biggrin.gif
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 7.06.2025 - 11:34
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn