GoldenLine
Zaloguj się
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

Witam.
Na swojej stronce chcialem zrobic plynne przejscia miedzy zdjeciami.
Efekt podobny do tych przykladow na tej stronie:
http://www.dynamicdrive.com/dynamicindex17/featuredcon...

Pomogl mi w tym kolega (ja javascript w ogole nie czaje) ale niestety nie wyszlo tak jak chcielismy i nie wiemy co dalej, jak zrobic zeby wszystko dzialalo prawidlowo.

Moja strona: http://scyther5.byethost31.com/foto.html

Z gory dziekuje i bede bardzo wdzieczny za pomoc i ewentualnie rady.
A.M.

PS: temat rowniez jest w watku JavaScript.
Link do wypowiedziLink
Michał Pawełczyk

Michał Pawełczyk Front-end developer
with some backend
skills and an eye
f...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

OK, najłatwiej to będzie zrobić wykorzystując jakiś framework do javascriptu, ja używam jquery (http://jquery.com). Tak więc ściągamy sobie jquery, wpinamy w nasz kod i na końcu pliku zawierającego tenże framework (coby nie mnozyć zapytań o pliki do serwera) wpisujemy coś takiego:


$(document).ready(function(){



});

To jest funkcja obsługująca zdarzenie ready obiektu document - czyli robiąca coś wtedy, gdy cały html się załaduje do przeglądarki.

W jej wnętrzu musimy napisać funkcję obsługującą kliknięcie na przyciskach, dla ułatwienia przyjmijmy, że każdy z nich w parametrze rel będzie miał id obrazka, którego pojawienie się powoduje, a wszystkie będą miały tą samą klasę (nazwijmy ją xxx).

Zakładamy, że wszystkie obrazki mają jakąś klasę i są wpisane w htmla, a w css mają display: none;
Tak więc zanim zaczniemy obsługiwać kliknięcia, musimy pokazać jeden z obrazków.

Zatem nasz kod będzie wyglądał tak: 


$(document).ready(function(){

  //pokazujemy obrazek

  $("img#obrazek1").show();

  var currentImage = "obrazek1";



  //obsługa kliknięcia na przyciskach

  $("a.xxx").click(function(){

    //chowamy widoczny obrazek

    $("img#" + currentImage).fadeOut();

    //zmieniamy zmienną określającą, który obrazek jest widoczny

    currentImage = $(this).attr("rel");

    //pokazujemy nowy obrazek

    $("img#" + currentImage).fadeIn();

    return false;

  });

});

Oczywiście to jest jeden z wielu sposobów rozwiązania twojego problemu, można go też wzbogacić, ale w tej formie powinien załatwić sprawę.
Link do wypowiedziLink
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

dzieki...jutro to podesle koledze zeby zobaczyl i jak zrobi to sie odezwe co i jak. Poki co wielkie dzieki.
Link do wypowiedziLink
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

Dzieki Michal....przenikanie dziala, ale pojawil sie maly problem.
Otoz w PORTFOLIO/IDENTYFIKACJA jak sie klikalo na rysunek po prawej powinno wyskoczyc okienko z jeszcze wiekszym powiekszeniem (co prawda laduje sie inny obraz)...teraz go nie ma. Najprawdopodobniej gryza sie frameworki i moze byc albo js/jquery-1.2.6.js albo te dwa pozostale ktore sa do tych okienek z powiekszonym zdjeciem.





Jakies rady?
Strona jest teraz pod adresem: http://www.scyther_5.dolsat.pl/
Link do wypowiedziLink

konto usunięte

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

Artur M.:

Jakies rady?

http://docs.jquery.com/Using_jQuery_with_Other_Libraries
Link do wypowiedziLink
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

wielkie dzieki chlopaki za pomoc...kumpel sobie bez problemu poradzil, wszystko dziala.
Link do wypowiedziLink
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

pojawil sie jeszcze jeden problem...otoz w /fotografia reklamowa/ jak sie klika na miniaturke to powiekszenie jednak nie dziala tak jak powinno. Najpierw mruga pierwsza fota dopiero pozniej nagle pojawia sie druga. Nie ma tego przejscia. Zauwazylem ze problem znika na przyklad za drugim razem, czyli wnioskuje ze zeby przenikanie prawidlowo dzialalo najpierw musza fotki byc w jakis sposob dodane do cache-u lub cos takiego.

Problem wystepuje tylko w zakladce fotografia reklamowa, natomiast w pozostalych wszystko dziala prawidlowo.

adres stronki: http://scyther_5.dolsat.pl
Link do wypowiedziLink

konto usunięte

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

na tamtych podstronasz masz skeszowana duza grafike (img src display none), na podstronie z grafika reklamowa w zrodle strony tego nie widac.
Link do wypowiedziLink
Artur M.

Artur M. Fotografia stokowa,
projekty graficzne
(logo, grafika
uży...

Temat: Prosba o pomoc ...przenikanie zdjec na stronie /javascript/

dzieki.
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

Prosba o pomoc




Wyślij zaproszenie do
Anuluj