ďťż

[JS] Problem z galerią w JQuery

       

Podstrony


telcocafe

Witam,

mam problem z uruchomieniem galerii będącej niejako pluginem do JQuery - GalleryView (http://plugins.jquery.com/node/7953)

Dane galerii tworzy prosty zestaw:

<ul id="gallery"> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> </ul>

A samą galerię odpala prosty kod w JS:

$(document).ready(function(){ $('#gallery').galleryView({ panel_width: 640, panel_height: 480, frame_width: 100, frame_height: 100 }); });

W ten sposób wszystko działa. Inaczej jest, jeśli pominę linijkę $(document).ready(function(){ wraz z jej zakończeniem }); i kod uruchomienia galerii wrzucę do jakieś funkcji - wtedy galeria nie uruchamia się, pomimo usilnych prób. Co może być tego przyczyną?



Ano to, że [Function] ready(fn) jest wykonywana po załadowaniu strony. Ty natomiast próbujesz coś zrobić nim dokument właśnie z blokiem #gallery się załaduje. Umieszczaj kod Javascript na końcu dokumentu tuż przed zamknięciem tagu body. To usprawni pracę i nie będziesz miał przez to takich problemów.

Tyle że ja to wrzucam do funkcji odpalanej jakimś tam przyciskiem, co powinno raczej gwarantować załadowanie się strony.

Hm. Musiałbyś pokazać kod, by można było cokolwiek stwierdzić w tym wypadku.




Hm. Musiałbyś pokazać kod, by można było cokolwiek stwierdzić w tym wypadku.

index.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/> <title>1, 2, Free!</title> <link rel="icon" type="image/png" href="./img/icon.png" /> <link rel="stylesheet" href="styl.css" type="text/css" /> <link rel="stylesheet" href="galleryview.css" type="text/css" /> <script src="js/jquery.js"></script> <script src="js/jquery.easing.js"></script> <script src="js/jquery.timers-1.1.2.js"></script> <script src="js/jquery.galleryview-2.0.js"></script> <script type="text/javascript"> function gal() { $('#gallery').galleryView({ panel_width: 640, panel_height: 480, frame_width: 100, frame_height: 100 }); } </script> </head> <body> <div id="logo"> <img src="./img/logo.png" style="position: relative; left: 20px; top: 5px;" /> </div> <div id="midd"> <div style="float:left"> <?php include("./menu.php"); ?> <div id="con"> <a href="#" onclick="gal();">aaaa</a> <ul id="gallery"> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> <li><span class="panel-overlay">opis zdjęcia</span><img src="sciezka do pliku.jpg" /></li> </ul> <br /><br /><br /> </div> <?php include("./stopka.php"); ?> </body> </html>

  • zanotowane.pl
  • doc.pisz.pl
  • pdf.pisz.pl
  • nvm.keep.pl

  • Sitedesign by AltusUmbrae.