rollover + czytanie z dokumentu

[raxiq]

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.

[raxiq]

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.

[Radian]

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;
}

[Kartofelek]

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.

[raxiq]

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");

itd.

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.

[Kartofelek]

Ah no dobrze. Wolę się nie udzielać w tym wątku, bo za dużo czasu zajmuje dekompilacja tego co piszecie.

[Radian]

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

[raxiq]

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ę

[raxiq]

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 ?

[Kartofelek]

To jest milion razy lepsze:
http://jqapi.com/