+- 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: rollover + czytanie z dokumentu (/thread-rollover-czytanie-z-dokumentu)
RE: rollover + czytanie z dokumentu - raxiq - 23-05-2012
Hmm, czyli jest problem z chrome i też nie wiem z czego on wynika, tą samą stronę otwierałem na chromie, na 2 rożnych kompach i była wyświetlana inaczej...;p
Tak swoją drogą teraz widzę, że robiłem niezły błąd, stad pewnie niewłaściwe wyświetlanie. Miałem 2 pliki tła. Tak jak wspomniałem 1 plik 1px x 975px pod repeat jako tło główne oraz jeden plik tła 960px x 975px jako plik tła dla zawartości, czyli strony głównej. Ten pierwszy wstawialem w html,body, a ten drugi w body, stąd pewno te nieporozumienia w wyświetlaniu. Poprawie kod i dam znać czy wszystko śmiga jak należy.
Dzięki jeszcze raz panowie.
RE: rollover + czytanie z dokumentu - raxiq - 01-06-2012
Kod:
<script>
$(function(){
$('#henrykimg').mouseover(function () {
$('#maciejimg').animate({
opacity: 0.5
},"slow");
$('#michalimg').animate({
opacity: 0.5
},"slow");
});
$('#henrykimg').mouseout(function () {
$('#maciejimg').animate({
opacity: 1
},"slow");
$('#michalimg').animate({
opacity: 1
},"slow");
});
});
</script>Da radę coś takiego zapętlić ? Tutaj akurat mam 3 elementy, ale np kiedyś jak bd potrzebował zrobić coś podobnego dla 100 to pisanie tego samego kodu dla 100 to chyba przesada.
RE: rollover + czytanie z dokumentu - Radian - 01-06-2012
Niestety nie mam teraz czasu ale mogę na szybciocha podrzucić:
for (i = 1; i <= 100; i++)
{
var zdanie = ("<p>echo</p>");
document.write (zdanie);
}
lub
i = 100;
while (i < 100)
{
document.write("<p>echo</p>");
++i;
}
RE: rollover + czytanie z dokumentu - Kartofelek - 01-06-2012
Zamiast ID użyć klas
Kod:
$(function(){
$('.henrykimg').mouseover(function () {
$(this).find('.maciej').animate({
opacity: 0.5
},"slow");
$(this).find('.michal').animate({
opacity: 0.5
},"slow");
});
$('.henrykimg').mouseout(function () {
$(this).find('.maciej').animate({
opacity: 1
},"slow");
$(this).find('.michal').animate({
opacity: 1
},"slow");
});
});I wtedy żadne pętle i ID nie są ci potrzebne.
RE: rollover + czytanie z dokumentu - raxiq - 01-06-2012
No tak tylko, że zauważ kod, który mi podałeś raczej nic nie zmienia, albo ja tego nie dostrzegam, bo tak jak mówię js dopiero zaczynam ruszać.
Mając 100 elementów dalej będę pisał dla każdego z nich:
Kod:
$(this).find('.maciej').animate({
opacity: 0.5
},"slow");Chodzi mi o to, aby kod odnosił się w taki sposób, że dla jednego elementu, np: mouseover(), na którymkolwiek z pozostałych elementów(wcześniej zawartych w bazie), wywoływał daną funkcję. Coś na zasadzie jak napisał Radian, ale php wolę się nie ruszać bo mam o nim jeszcze mniejsze pojęcie jak o js.
RE: rollover + czytanie z dokumentu - Kartofelek - 01-06-2012
Ah no dobrze. Wolę się nie udzielać w tym wątku, bo za dużo czasu zajmuje dekompilacja tego co piszecie.
RE: rollover + czytanie z dokumentu - Radian - 01-06-2012
raxiq, nie czytałem twojego kodu tylko podrzuciłem ci dwie pętle może ci sie przydadzą (pętle w JS nie php), gdy wywołujesz pewną funkcje po zdarzeniu onclick czy tam po najechaniu myszką na obiekt np o id="test", gdy takich divów czy tam span czy cokolwiek będziesz miał 100 to do każdego musiał byś dawać inny id i nową pętle tam w header gdzie masz kod JS, ale... możesz dać class i tutaj jest styl jakiś... styl może mieć 100 obiektów taki sam np. class="zielony_box" potem zamiast #henrykimg dasz .zielony_box
Sam jestem laik i nie wiem czy w tym momencie animacja jakaś (zależy co tam masz) nie będzie załączona na wszystkich zielonych boxach
ale pewnie też da sie to zrobić tak, aby wszystko działało na tym na którym trzymasz wskaźnik myszki.Sry, śpiesze sie, jestem w pracy i moge niezrozumiale troszkę pisać :p
RE: rollover + czytanie z dokumentu - raxiq - 01-06-2012
chwila, bo wy chyba rzeczywiście dobrze piszecie, a ja jestem kretyn i nie mogę skumać ;p
EDIT: Nie wiem czy to da się zrobić przy użyciu class czy też nie, mimo wszystko chodzi mi o coś tego typu(kod oczywiście, źle napisany bo nie mam pojęcia jak to napisać w tym języku):
Kod:
$(function(){
for (prawo = {'#prawo1,#prawo2,#prawo3,#prawo4,#prawo5,#prawo6,#prawo7,#prawo8,#prawo9'})
$('prawo').mouseover(function () {
$('prawo').animate({
opacity: 1
},"slow");
$('prawo-1').animate({
opacity: 0.5
},"slow");
});Po polsku to ma wyglądać tak:
Dla "prawo" ze zbioru {'#prawo1,#prawo2,#prawo3,#prawo4,#prawo5,#prawo6,#prawo7,#prawo8,#prawo9'}, podczas "mouseover" animuj wskazany element(opacity: 1) oraz animuj całą reszte(opacity: 0.5).
Nie wiem, lepiej tego nie wytłumaczę, może i da rade użyć klas, tak jak wcześniej powiedziałem, ale zapewne przyda się nie tylko mi coś takiego w przyszłości, dlatego zawracam dupę
RE: rollover + czytanie z dokumentu - raxiq - 05-06-2012
Macie racje. Odpuściłem sobie kombinowanie, bo więcej czasu mi to zajmuje, aniżeli nawet pisane powtarzającego się kodu.
Generalnie jeżeli chodzi o jQuery to korzystam z http://www.w3schools.com/jquery/
Mimo wszystko dzięki za pomoc. I takie pytanko, zanim zacznę się kiedyś za to bawić. Pomyślałem, że fajnie by wyglądała cała strona wykonana w jQuery. Generalnie opłaca się taką stronę tworzyć ? Estetycznie zapewne wygląda lepiej dla laika, pytanie czy np. nadmierne stosowanie jQuery nie przeszkadza w pozycjonowaniu itd ?
RE: rollover + czytanie z dokumentu - Kartofelek - 05-06-2012
To jest milion razy lepsze:
http://jqapi.com/