Witam
Mam trywialny problem, z którym jakoś nie mogę sobię poradzić
Mam dwie tabelki oparte na divach. Jak zrobić aby po najechaniu kursorem na wiersz w pierwszej tabelce podświetlił się wiersz w drugiej tabeli (równocześnie)?

Możesz pokazać kod? Bo jakoś ciężko mi wyobrazić sobie głupotę pt. tabelki oparte na divach

Była taka nagonka, żeby nie robić stron na tabelkach. Bo tabelki służą do przedstawiania danych tabelarycznych. Teraz będzie nagonka żeby danych tabelarycznych nie przedstawiać w div'ach

W CSS (nie działa pod IE)

[CSS] pobierz, plaintext 
div:hover { background: yellow; }
[CSS] pobierz, plaintext 

[CSS] pobierz, plaintext 
tr:hover { background: yellow; }
[CSS] pobierz, plaintext 

W JS, funkcją onmouseover lub łatwiej w jQuery funkcją .hover()

kod jest nie ważny, może być nawet tabelka
podświetlenie potrafię zrobić
nie wiem jak zrobić aby po najechaniu na wiersz w pierwszej tabelce zaświecił się pierwszy wiersz w drugiej tabelce która znajduję się np na dole strony
tu mam problem !

Jak masz je obok siebie możesz je dać do wspólnego DIVa i jemu nadać wartość xx i xx:hover na przykład z różnym opacity.

no właśnie problem jest w tym że są w zupełnie innym miejscu !

dodaj do w pierwszej i drugiej tabelce takie same id i powinno dzialac, nadaj im hover

Nie id, a class.

a może jakiś przykład ?

[HTML] pobierz, plaintext 
<table>
<tr><td id="jeden" class="jeden">Tekst</td></tr>
</table>
<table>
<tr><td class="jeden">Tekst 2</td></tr>
</table>
[HTML] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function(){
 
$('#jeden').hover(function(){
$('.jeden').css('background', 'yellow');
}),
function(){
$('.jeden').css('background', 'white');
})
 
})
[JAVASCRIPT] pobierz, plaintext 

Powinno działać.

dzięki, ale coś nie za bardzo hula :/

A bibliotekę jQuery dołączyłeś?

podpiąłem bez zmian

Mała literówka.

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function(){
 
$('#jeden').hover(function(){	
	$('.jeden').css('background', 'yellow');
}, //tu był nawias i to powodowało błąd
function(){
	$('.jeden').css('background', 'white');
})
 
 
 
})
[JAVASCRIPT] pobierz, plaintext 

ok hula
to jeszcze jedno pytanko!, a jak mam więcej wierszy np w pierwszej tabeli mam 5 i w drugiej tabeli mam 5, i teraz chciałbym aby
po najechaniu na 1-szy wiersz podświetlił się 1-szy wiersz w tabeli drugiej, 2 - 2, 3 - 3 itp.

Możesz analogicznie kopiować, lub załatwić to funkcją.

[HTML] pobierz, plaintext 
<table>
<tr><td id="jeden" class="jeden">Tekst</td> <td id="dwa" class="jeden">Tekst</td> <td id="trzy" class="jeden">Tekst</td></tr>
</table>
<table>
<tr><td class="jeden">Tekst 2</td> <td class="dwa">Tekst 2</td> <td class="trzy">Tekst 2</td></tr>
</table>
[HTML] pobierz, plaintext 

I w skrypcie, kopiujesz to co jest w document ready i powielasz zmieniając id i class.

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function(){
 
$('#jeden').hover(function(){	
	$('.jeden').css('background', 'yellow');
}, 
function(){
	$('.jeden').css('background', 'white');
})
 
$('#dwa').hover(function(){	
	$('.dwa').css('background', 'yellow');
}, 
function(){
	$('.dwa').css('background', 'white');
}) 
 
 
})
[JAVASCRIPT] pobierz, plaintext 

domyśliłem się że można analogicznie skopiować kod
mnie bardziej interesuje rozwiązanie troszkę bardziej skomplikowane, bo przecież jak będę mieć 50 wierszy to będzie mały problem !

Przy założeniu że tabele mają tę samą ilość wierszy:

[JAVASCRIPT] pobierz, plaintext 
tabela1 = $('#tabela1 tr');
tabela2 = $('#tabela2 tr');
 
tabela1.hover(function(){ //twoje wiersze w piersze 	
	tabela2.eq($(this).index()).addClass('highlight'); //klasa highlight w której definiujesz styl podświetlenia
function(){
	tabela2.eq($(this).index()).removeClass('highlight');
});
[JAVASCRIPT] pobierz, plaintext 

nie wiem, chyba jestem jakiś upośledzony
albo oba wiersze w obydwu tabelach się podświetlają albo w ogóle nic się z nimi nie dzieje ! :/

Ech, w skrypcie jest błąd:

[JAVASCRIPT] pobierz, plaintext 
tabela1 = $('#tabela1 tr'); //definiuje wszystkie wiersze w pierwszej tabeli (masz to na divach - nie wiem co stosujesz zamiast 'tr')
tabela2 = $('#tabela2 tr'); //jak wyżej
 
tabela1.hover(
   function(){ 
      $(this).addClass('highlight'); //podswietla najechany element w tabeli 1
      tabela2.eq($(this).index()).addClass('highlight'); // podswietla odpowiadający element w drugiej tabeli
   },
   function(){ //usuwa podświetlenie
      $(this).removeClass('highlight');
      tabela2.eq($(this).index()).removeClass('highlight');
   }
);
 
// I na odwrót
 
tabela2.hover(
   function(){ //twoje wiersze w piersze
      $(this).addClass('highlight'); //podswietla najechany element w tabeli 1
      tabela1.eq($(this).index()).addClass('highlight'); // podswietla odpowiadający element w drugiej tabeli
   },
   function(){ //usuwa podświetlenie
      $(this).removeClass('highlight');
      tabela1.eq($(this).index()).removeClass('highlight');
   }
);
[JAVASCRIPT] pobierz, plaintext 

Żeby zrobić coś dla większej ilości rekordów, musisz mieć dwie funkcje.

1. Która za załadowaniem strony do każdego elementu z id w obszarze table1 przypisze akcje hover, która ma wykonać drugą funkcje przekazując jej w parametrach nazwę aktualnie najechanego elementu.

2. Funkcja podświetli odpowiedni element, po klasie którą ma w parametrze od pierwszej funkcji.

Zakodować tego nie potrafię, ale można coś próbować z pętlą która jedzie po każdym id w tabeli.