Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Porównanie wartości z elementu <span>
Matol66
post 6.05.2013, 09:24:58
Post #1





Grupa: Zarejestrowani
Postów: 11
Pomógł: 0
Dołączył: 16.11.2012

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


Witam.

Otóż chciałbym uzykać taki efekt:

Mam diva #lista-1 i diva #lista-2, w każdym divie są po 4 elementy <span>(docelowo nie będzie to stała liczba), po najechaniu na element <span> w divie #lista-2, chciałbym porównać wszystkie wartości ze <span> z diva #lista-1 i te które są większe od wartości na której aktualnie znajduje się kursor myszy miałyby zmienić tło.


  1. <div id="lista-1>
  2. <span>0,39</span>
  3. <span>0,55</span>
  4. <span>0,78</span>
  5. <span>0,28</span>
  6. </div>
  7.  
  8. <div id="lista-2>
  9. <span>0,58</span>
  10. <span>0,11</span>
  11. <span>0,64</span>
  12. <span>1,32</span>
  13. </div>


Proszę o porady jak to ugryźć
Go to the top of the page
+Quote Post
Arcioch
post 6.05.2013, 12:01:08
Post #2





Grupa: Zarejestrowani
Postów: 324
Pomógł: 110
Dołączył: 18.09.2012

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


Proszę bardzo smile.gif
http://jsfiddle.net/Y6LY4/1/

Zmieniłem przecinek na kropkę w spanach smile.gif
Po najechaniu na element na liście drugiej pobieram jego wartość i zapisuje w zmiennej wartosc smile.gif Następnie sprawdzasz pętlą czy któraś wartość z listy pierwszej jest większa od zmiennej wartosc i nadajesz elementowi tło smile.gif
Po wyjechaniu muszką za span z listy drugiej czyścisz tło.

Pozdrawiam
Arcio
Go to the top of the page
+Quote Post
hubson87
post 6.05.2013, 12:04:50
Post #3





Grupa: Zarejestrowani
Postów: 83
Pomógł: 8
Dołączył: 9.02.2011
Skąd: Wrocław

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


[JAVASCRIPT] pobierz, plaintext
  1.  
  2.  
  3. $(document).ready(function(){
  4. $("#lista-2 span").mouseenter(function(){
  5. var x = parseFloat($(this).text().replace(/,/g,'.'));
  6. $("#lista-1 span").each(function(){
  7. if (parseFloat($(this).text().replace(/,/g,'.')) > x)
  8. $(this).addClass("hovered");
  9. })
  10. }).mouseleave(function(){
  11. $(".hovered").each(function(){
  12. $(this).removeClass("hovered");
  13. })
  14. });
  15. })
[JAVASCRIPT] pobierz, plaintext


i np.

  1. .hovered{background:red;}


Go to the top of the page
+Quote Post

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

 



RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 01:39