Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS]Podtrzymanie Klasy Hover
Forum PHP.pl > Forum > Przedszkole
DonPolaczek
Witam serdecznie, chciałbym się dowiedzieć jak zrobić podtrzymanie hover po najechaniu myszką na niego do czasu wybrania następnego. Jakieś sugestie ? Dzięki z góry.
  1. .Strony {
  2. width: 165px;
  3. height:200px;
  4. display:block;
  5. background-image: url('Menu_01.png');
  6. }
  7. .Strony:hover {
  8. background-image: url('Hover_Menu_01.png');
  9. }
b4rt3kk
Zrób skrypt w jQuery, coś w stylu:

  1. $('.Strony').hover(function(){
  2. $('.Strony').removeClass('klasa_co_zmieni_tlo');
  3. $(this).addClass('klasa_co_zmieni_tlo');
  4. });
DonPolaczek
Nie bardzo to działa ale spróbuję znaleźć rozwiązanie za dalsze sugestię dziękuję.
  1. $('.Strony').hover(function(){
  2. $('.Strony').removeClass('.Strony:hover');
  3. $(this).addClass('.Strony:hover');
  4. });

Umieściłem pod:
  1. <td>
  2. <a href="#Strony" class="Strony"</a>
  3. </td>

// EDIT:
Mam coś takiego co działa na zwykłą najprostszą klasę:
  1. <button class="inactive" value="test">Button</button>

[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(function(){
  2. $('button').click(function(){
  3. $(this).addClass('clicked');
  4. });
  5. });
[JAVASCRIPT] pobierz, plaintext

  1. .inactive {background-color:gray;}
  2. .clicked {background-color:orange;}

Ale Niestety nie działa to w przypadku hover image.

Odświeżam temat nadal nie mogę znaleźć rozwiązania.
trueblue
http://jsfiddle.net/5Lyjshbh/
DonPolaczek
Niestety ale na ten kod to nie działa dodam że używam Wordpress i wszystkie funkcje javascript działają poprawnie np: Alert itd.
  1. .Strony {
  2. width: 165px;
  3. height:200px;
  4. display:block;
  5. background-image: url('Menu_01.png');
  6. }
  7. .Strony:hover {
  8. background-image: url('Hover_Menu_01.png');
  9. }


Wypróbuj nawet na tej stronie co mi wysłałeś to nie działa. Nie wiem jak to zrobić na prawdę... Proszę o pomoc.
Raito
http://jsfiddle.net/f53y7h75/
Chyba o coś takiego chodziło?
DonPolaczek
Nie wiem czy zauważyliście i czy ma to jakieś znaczenie ale mój hover jest po : a nie po .
  1. .Strony:hover {
  2. background-image: url('Hover_Menu_01.png');
  3. }

Zmieniając na .Strony:hover na .Strony.hover to hover po prostu nie funkcjonuje.
trueblue
Napisałeś, że kod podany w linku (http://jsfiddle.net/5Lyjshbh/), nie działa.
Na jakiej przeglądarce?
Raito
Nie wiem, czy zauważyłeś, że w hiperłączach dajesz class="strona", a w css odnosisz się .Strona. Jest różnica czy zaczynasz od dużej czy od małej litery
DonPolaczek
Nie działa z moim zapytaniem na stronie a nie ze zmianą tła. Zobacz sam:
http://jsfiddle.net/f53y7h75/4/
Wiem o tym że w Klasach to robi różnice i to znaczną u siebie odwołuję się do .Strony nie martw się nie kopiuję na ślepo kodu.
PS: Hover jest biały dla tego nie widać go po najechaniu myszką ale jak by funkcjonowało Menu zostało by białe.
Raito
Nie działa? http://jsfiddle.net/f53y7h75/5/
DonPolaczek
Widzę że zamieniłeś Strony:hover na Strony.hover zobaczymy jak na serwerze to zaakceptuję.
Na stronie brak efektów przez zmianę na . Jak to możliwe ?

Odświeżam temat, dodam że korzystam z Wordpress. Jakim powodem jest brak działania klasy hover po zmianie : na .
tete
Tego szukasz: http://cherne.net/brian/resources/jquery.hoverIntent.html
DonPolaczek
Wszystko spoko tylko nie wiem czy zauważyłeś żadna z tych klas nie ma podtrzymania...
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.