prettyPhoto不适用于其他页面

Question

我对prettyPhoto有问题。它完全适用于我的另一个名为：portfolio.html的页面。 在Index.html中，我还想让一些图像与prettyPhoto一起使用，但它不会对代码做出响应。我有这个：

在index.html的顶部：

<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>

中间：

  <div class="boxA">
                <a href="images/images/barn_owl.jpg" data-rel="prettyPhoto" title="This is the description"><img class="bottom" src="images/knop-hover1.jpg" />
                <img class="top" src="images/knop-1.jpg" /></a>
    </div>
            <div class="boxB">
            <a data-rel="prettyPhoto" href="images/images/siamang.jpg"><img class="bottom" src="images/knop-hover-siamang.jpg" />
              <img class="top" src="images/knop-siamang.jpg" /></a>
    </div>
            <div class="boxC">
                <a href="portfolio-cover.html"><img class="bottom" src="images/knop-hover-cover.jpg" />
              <img class="top" src="images/knop-cover.jpg" /></a>
            </div>

底部：

<script>
//prettyPhoto 
jQuery(document).ready(function(){
    jQuery('a[data-gal]').each(function() {
        jQuery(this).attr('rel', jQuery(this).data('gal'));
    });     
    jQuery("a[data-rel^='prettyPhoto']").prettyPhoto({animationSpeed:'slow',theme:'light_square',slideshow:false,overlay_gallery: false,social_tools:false,deeplinking:false});
}); 


</script> 

如果有人知道prettyPhoto，我希望你能帮助我。日Thnx。