0

我正在尝试使用 prettyPhoto 和 bootstrap 制作一个简单的灯箱画廊。出于某种原因，当我单击图像缩略图时，它只是在空白图像页面中打开它，而不是使用 js。

Chrome 开发工具给了我这个：

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>
4

1 回答 1

1

看来 jQuery 没有加载。检查您的外部脚本是否指向正确的位置。

于 2013-04-27T22:55:39.517 回答