Problem z Lightbox'em, nadal nie rozwiązany

pytanie zadane 11 października 2015 w HTML i CSS przez Paweł123 Nałogowiec (33,500 p.)

Cześć, ma problem. Od wczoraj męczę się z Lightbox'em i nadal nie wiem co robię źle. Mógłby ktoś wysłać mi linka do strony najlepiej polskiej, która wytłumaczy jak wszystko zrobić. Wysyłam kod, może ktoś tutaj mi pomoże :D

<!doctype html>
<html>
<head>
   <link href="css/lightbox.css" rel="stylesheet"> 
  
   
   

</head>
<body>
    <script src="js/lightbox.js"></script>
 
    <a href="IMG_5512.JPG" data-lightbox="image-1" data-title="My caption">Image #1</a>

</body>


</html>

5 odpowiedzi

odpowiedź 11 października 2015 przez writen Nałogowiec (29,060 p.)
wybrane 11 października 2015 przez Paweł123

Najlepsza

Zapewne ten skrypt korzysta z jquery. Więc musisz dołączyć do strony jquery :p

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

Wszystkie skrypty umieść tuż przed </body> pod całą zawartością strony. Pamiętaj, że jquery musi być dołączone pierwsze, czyli nad skryptem lightbox.

komentarz 11 października 2015 przez Paweł123 Nałogowiec (33,500 p.)

Nie rozumiem :(

Sciągnąłem Lightbox'a z tej strony http://lokeshdhakar.com/projects/lightbox2/ i chcę go zainstalować, ale ma problem mógłbyś wytłumaczyć mi krok po kroku jak to zrobić?

komentarz 11 października 2015 przez writen Nałogowiec (29,060 p.)
edycja 11 października 2015 przez writen

Wszystko zrobiłeś dobrze, tylko nie dołączyłeś biblioteki jquery, która jest dla tego skryptu wymagana. Wystarczy, że wkleisz do strony kod, który podałem, przed skryptem lightbox.js lub zamiast pliku lightbox.js dołącz lightbox-plus-jquery.js

komentarz 11 października 2015 przez Paweł123 Nałogowiec (33,500 p.)

Jesteś WIELKI :D Działa :D :D

DZIĘKUJE ZA POMOC :D

odpowiedź 11 października 2015 przez niezalogowany

Dołącz CSS na górze strony w swoim tagu: Dołącz Javascript w dolnej części strony przed zamykającym tagiem: < script src = "path/to/lightbox.js" > </ script > Upewnij się, jQuery, które jest wymagane przez Lightbox, jest również ładowane. Jeśli korzystasz już z jQuery na swojej stronie, upewnij się, że jest załadowany przed lightbox.js jQuery 1.7 lub wyższa jest wymagana. Jeśli nie używasz jQuery, stworzyłem plik spakowany, który obejmuje zarówno Lightbox i jQuery. Dołącz dist/js/lightbox-plus-jquery.js zamiast lightbox.js Potwierdź, że cztery zdjęcia załadowane przez lightbox.css są w odpowiednim miejscu. Możesz pobrać obrazy z /dist/images folderze.

odpowiedź 11 października 2015 przez furas Maniak (53,800 p.)

Powtórzę przykład bo już raz odpowiadałem na to pytanie w innym wątku.
W pełni działający przykład https://jsfiddle.net/dpkemaav/

Skrypt musi być dołączony na końcu pliku bo inaczej zostanie on wykonany zanim wczyta się cały kod HTML, w którym są informacje o zdjęciach, i skrypt nie znajdzie "data-lightbox" do których ma przyczepić wyświetlanie w ramce.

Druga sprawa - Lightbox2 wymaga do działania biblioteki jQuery więc albo trzeba ją samemu ściągnąć i podobnie dołączyć (jquery musi być dołączony przed Lightbox) albo trzeba użyć wersji Lightbox zawierającej jquery i lightbox w jednym pliku - tak jak w przykładzie.

odpowiedź 11 października 2015 przez niezalogowany

Jak robisz tego lightbox piszesz go sam czy msz gotowy skrypt?

<script src="js/lightbox.js"></script>

podempnij w sekcji head zamiast w body !

komentarz 11 października 2015 przez writen Nałogowiec (29,060 p.)

Nie, nie. Nie rób tak. Skrypty najlepiej umieszczać tuż przed </body>.

komentarz 11 października 2015 przez niezalogowany

Dlaczego tak uważasz ?

komentarz 11 października 2015 przez writen Nałogowiec (29,060 p.)

Serio za każdym razem trzeba to tłumaczyć?

komentarz 11 października 2015 przez niezalogowany

tylko grzecznie spytałam

komentarz 11 października 2015 przez Paweł123 Nałogowiec (33,500 p.)

Sciągnąłem Lightbox'a z tej strony http://lokeshdhakar.com/projects/lightbox2/ i chcę go zainstalować, ale ma problem mógłbyś wytłumaczyć mi krok po kroku jak to zrobić?

komentarz 11 października 2015 przez writen Nałogowiec (29,060 p.)

Paweł123 Wytłumaczyłem to w mojej odpowiedzi.

Roza Po prostu nie chce mi się tego za każdym razem tłumaczyć. Jest to bardzo dobra praktyka. Przy jednym skrypcie może nie jest to odczuwalne, ale przy stronach, które korzystają z tony plików js obsadzonych w head, to nie chce mi się czekać aż taka strona się załaduje. Można ładować skrypty asynchronicznie, ale czemu prawie nikt z tego nie korzysta? (nie gniewaj się )

odpowiedź 24 kwietnia 2016 przez Artur Wraga Obywatel (1,870 p.)

Mi działa tylko jezeli zrobie tak, i musisz jeszcze dodac w linku w sekcji <a href="link" data-lightbox="sample_image"></a>

<html>

<head>
  <link type="text/css" rel="stylesheet" href="css/lightbox.min.css"/>		
  <script type="text/javascript" src="js/jquery-2.2.3.min.js"></script>	
</head>
<body>

    <!-- na samym koncu przed tagiem zamykającym body --!>

   <script type="text/javascript" src="js/lightbox.min.js"></script>	
</body>
</html>

</html>