+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Podświetlenie po najechaniu myszką (/thread-pod%C5%9Bwietlenie-po-najechaniu-myszka)
Strony:
1
2
Podświetlenie po najechaniu myszką - lukasmily - 24-08-2011
Mam do dyspozycji FrontPage i Share Point Designer.
Chciałbym zrobić podświetlenie, zmianę koloru wiersza tabeli po najechaniu na niego kursorem myszki.
Moja tabela to około 200 wierszy. Da się to szybko zrobić w którymś z wymienionych wyżej programów?
PS. Ręcznie dopisując potrzebne elementy kodu do każdego wiersza to koszmar. Pewnie na finał pora roku się zmieni...hehe.
Pomóżcie.
RE: Podświetlenie po najechaniu myszką - zacharij - 24-08-2011
Jeśli ma to być wiersz tabeli to musisz użyć jQuery, a dokładnie mouseover:
http://api.jquery.com/mouseover/
RE: Podświetlenie po najechaniu myszką - Pedro84 - 24-08-2011
Hover też wystarczy, tylko, że ułomne przeglądarki go nie obsłużą.
RE: Podświetlenie po najechaniu myszką - lukasmily - 24-08-2011
No tak, wiem o tym. Ale przerabiać 200 linijek kodu?
Nie da się w tych programach co podałem przypisać jakiejś funkcji wierszą?
RE: Podświetlenie po najechaniu myszką - zacharij - 24-08-2011
A po co chcesz przerabiać 200 linijek?
Wystarczy odpowiednio napisać funkcję w jQuery i po sprawie, w sumie wyjdzie Cie może 6 linijek w JS i tyle.
Kod:
<script type="text/javascript">
$(document).ready(function() {
$("table tr").mouseover(function() {
$(this).css("background","#fff");
});
$("table tr").mouseout(function() {
$(this).css("background","#000");
});
});
</script>RE: Podświetlenie po najechaniu myszką - Kartofelek - 24-08-2011
Dla jQuery:
Kod:
$(function()
$('table td').hover(
function() {$(this).parent().addClass('podswietlone');},
function() {$(this).parent().removeClass('podswietlone');}
);
});Kod:
.podswietlone td {background:red;}Oczywiście trzeba dorzucić bibliotekę jquery
RE: Podświetlenie po najechaniu myszką - lukasmily - 24-08-2011
zacharij
Prawie o to mi chodziło.
Poszczególny wiersz składa się z czterech kolumn z tekstem.
chciałbym, żeby taki kod podświetlał mi wszystkie kolumny w tabeli jednocześnie.
Wiesz, jedziesz myszka z góry na dol i się podświetla cały wiersz.
Scalenie kolumn nie wchodzi w grę bo tekst się sypie.
Taj jak na tej stronie np:
http://audio.com.pl/sklepy-lista/1/2
zrobiłem podgląd tej strony w HTML i układ jest identyczny jak u mnie. czyli mnóstwo wierszy podzielonych na kolumny.
Mimo to im się podświetla cały wiersz, a u mnie poszczególne kolumny.
RE: Podświetlenie po najechaniu myszką - Kartofelek - 24-08-2011
bo ty pewnie masz cellspacing dla tej tabeli > 0
Co do nadawania koloru dla TR - może niektórym to będzie przeszkadzało, ale w starszych IE to nie działa
dlatego lepiej ustawiać bezpośrednio dla TD. I nie kolor a klasę!
RE: Podświetlenie po najechaniu myszką - lukasmily - 24-08-2011
Czy mógłby mi ktoś przerobić ten kod , żeby działał tak jak chce?
Bardzo proszę.
<script type="text/javascript">
$(document).ready(function() {
$("table tr").mouseover(function() {
$(this).css("background","#fff");
});
$("table tr").mouseout(function() {
$(this).css("background","#000");
});
});
</script>
RE: Podświetlenie po najechaniu myszką - zacharij - 24-08-2011
(24-08-2011, 20:57)lukasmily napisał(a): Czy mógłby mi ktoś przerobić ten kod , żeby działał tak jak chce?
Bardzo proszę.
<script type="text/javascript">
$(document).ready(function() {
$("table tr").mouseover(function() {
$(this).css("background","#fff");
});
$("table tr").mouseout(function() {
$(this).css("background","#000");
});
});
</script>
Wrzuć gdzieś stronę online i będziemy wiedzieć o co dokładnie Ci chodzi, lub co jest przyczyną, że ten kod nie działa ok, ale podejrzewam że przyczyny są takie jak napisał kartofelek.