PrettyPhoto в начальной загрузке не загружается лайтбокс

Я пытаюсь сделать простую галерею лайтбокса, используя prettyPhoto и bootstrap. По какой-то причине, когда я нажимаю на эскиз изображения, он просто открывает его на пустой странице изображения, а не с помощью js.

Chrome Dev Tools дает мне это:

Uncaught TypeError: undefined is not a function - bootstrap.min.js:6
Uncaught ReferenceError: jQuery is not defined - jquery.prettyPhoto.js:7
Uncaught ReferenceError: $ is not defined - portfolio.html:10

Это беспокоило меня в течение многих часов, любая помощь очень ценится! Спасибо!

<!DOCTYPE html>
<html>
 <head>
    <meta charset="utf-8">
    <title>Kim Pirring Design</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script language="JavaScript" type="text/javascript" src="js/bootstrap.min.js"></script>
    <script language="JavaScript" type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
    <script language="JavaScript" type="text/javascript" charset="utf-8">
        $(document).ready(function(){
        $("a[rel='prettyPhoto']").prettyPhoto();
      });
    </script>

    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/prettyPhoto.css">

 </head>

 <body>
    <div class="container">
        <h1>Kim Pirring Design</h1>
        <div class='navbar navbar-inverse'>
         <div class='navbar-inner nav-collapse' style="height: auto;">
        <ul class="nav">
          <li><a href="index.html">Home</a></li>
          <li class="active"><a href="portfolio.html">My Work</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="resume.html">Resume</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
          </div>
         </div>

       <ul class="thumbnails">
                <li class="span3">
                        <a class="thumbnail" rel="prettyPhoto" href="images/fullscreen/1.jpg"><img class="group1" src="images/fullscreen/1.jpg" title="Image Title" /></a>
                    </li> <!--end thumb -->
                    <li class="span3">
                        <a class="thumbnail" rel="lightbox[group]" href="img/pics/2.jpg"><img class="group1" src="img/pics/2.jpg" title="Image Title" /></a>
                    </li> <!--end thumb -->
                    <li class="span3">
                        <a class="thumbnail" rel="lightbox[group]" href="img/pics/3.jpg"><img class="group1" src="img/pics/3.jpg" title="Image Title" /></a>

            </ul><!--end thumbnails -->



 <footer>
        <p>&copy; Kim Pirring 2013</p>
  </footer> 
 </div><!-- .container -->


 </body>
</html>
Источник

1 ответ

Решение

Похоже, что jQuery не загружается. Убедитесь, что ваши внешние скрипты указывают на правильное место.

Источник
Другие вопросы по тегам