[CSS]Podtrzymanie Klasy Hover Opcje

[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.

[CSS] pobierz, plaintext 
.Strony { 
width: 165px; 
height:200px; 
display:block; 
background-image: url('Menu_01.png'); 
} 
.Strony:hover { 
background-image: url('Hover_Menu_01.png'); 
}
[CSS] pobierz, plaintext 

Ten post edytował DonPolaczek 3.02.2015, 14:44:56

[b4rt3kk]

Zrób skrypt w jQuery, coś w stylu:

[HTML] pobierz, plaintext 
$('.Strony').hover(function(){
  $('.Strony').removeClass('klasa_co_zmieni_tlo');
  $(this).addClass('klasa_co_zmieni_tlo');
});
[HTML] pobierz, plaintext 

[DonPolaczek]

Nie bardzo to działa ale spróbuję znaleźć rozwiązanie za dalsze sugestię dziękuję.

[HTML] pobierz, plaintext 
<script>
$('.Strony').hover(function(){
  $('.Strony').removeClass('.Strony:hover');
  $(this).addClass('.Strony:hover');
});
</script>
[HTML] pobierz, plaintext 

Umieściłem pod:

[HTML] pobierz, plaintext 
<td>
        <a href="#Strony" class="Strony"</a>
</td>
[HTML] pobierz, plaintext 

// EDIT:
Mam coś takiego co działa na zwykłą najprostszą klasę:

[HTML] pobierz, plaintext 
<button class="inactive" value="test">Button</button>
[HTML] pobierz, plaintext 

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

[CSS] pobierz, plaintext 
 .inactive {background-color:gray;}
 .clicked {background-color:orange;}
[CSS] pobierz, plaintext 

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

Odświeżam temat nadal nie mogę znaleźć rozwiązania.

Ten post edytował DonPolaczek 3.02.2015, 20:53:19

[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.

[CSS] pobierz, plaintext 
.Strony { 
width: 165px; 
height:200px; 
display:block; 
background-image: url('Menu_01.png'); 
} 
.Strony:hover { 
background-image: url('Hover_Menu_01.png'); 
}
[CSS] pobierz, plaintext 

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?

Ten post edytował Raito 6.02.2015, 19:53:59

[DonPolaczek]

Nie wiem czy zauważyliście i czy ma to jakieś znaczenie ale mój hover jest po : a nie po .

[CSS] pobierz, plaintext 
.Strony:hover { 
background-image: url('Hover_Menu_01.png'); 
}
[CSS] pobierz, plaintext 

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.

Ten post edytował DonPolaczek 7.02.2015, 13:01:48

[Raito]

Nie działa? http://jsfiddle.net/f53y7h75/5/

Ten post edytował Raito 7.02.2015, 13:03:19

[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 .

Ten post edytował DonPolaczek 7.02.2015, 13:28:33

[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...