0

我想知道是否有人可以提供帮助。

我正在使用下面的脚本在 fancyBox 中创建一个“图片库”。

<!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">  
<head>  
  <title>Gallery</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>   
  <script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script> 
  <script type="text/javascript" src="fancybox/jquery.easing-1.4.pack.js"></script> 
  <script type="text/javascript" src="fancybox/jquery.easing-1.4.pack.js"></script>  
  <script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js?v=1.0.2"></script>  
  <script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.0"></script>  
  <script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.0.6"></script>  
  <link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.2" type="text/css" media="screen" />  
  <link rel="stylesheet" href="fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />  
  <link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.0.6" type="text/css" media="screen" />  

  <script type="text/javascript">  

            $('.fancybox').fancybox({
                openEffect  : 'elastic',
                closeEffect : 'elastic',

                prevEffect : 'none',
                nextEffect : 'none',

                closeBtn  : false,

                helpers : {
                    title : {
                        type : 'inside'
                    },
                    buttons : {}
                },

                afterLoad : function() {
                    this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
                }
            });



</script> 
  <style type="text/css">
<!--
.style1 {
    font-size: 14px;
    margin-top: 5px;
    margin-right: 110px;
}
-->
  </style>  
</head>
<body style="font-family: Calibri; color:  #505050; margin-left: 240px;">
<div align="right" class="style1"> <a href = "javascript:document.gallery.submit()"/> Add Images <a/> &larr; View Uploaded Images </div> 
  <form id="gallery" name="gallery" class="page" action="index.php" method="post" style="margin-left: -120px; margin-right: 50px;"> 

    <p>
      <?php for ($i = 0; $i < $descriptions->documentElement->childNodes->length; $i++) :  
                          $xmlFile = $descriptions->documentElement->childNodes->item($i);  
                          $name = htmlentities($xmlFile->getAttribute('originalname'), ENT_COMPAT, 'UTF-8');  
                          $description = htmlentities($xmlFile->getAttribute('description'), ENT_COMPAT, 'UTF-8');  
                          $source = $galleryPath . rawurlencode($xmlFile->getAttribute('source'));  
                          $thumbnail = $thumbnailsPath . rawurlencode($xmlFile->getAttribute('thumbnail'));  
                  ?>
      <a class="fancybox" rel="allimages" title="<?php echo $name; ?>" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" /></a>
      <?php endfor; ?>  
    </p>
</form>  
</body>
</html>

我遇到的问题是我无法从我的 fancyBox Javascript 中创建任何功能，例如“按钮助手”功能和图像格式中的标题。

我已经从这里的“fancyapps”页面获取了代码，所以我不太确定我哪里出错了。我对fancyBox比较陌生，所以也许这些只是初学者的错误。

我只是想知道是否有人可以看看这个并让我知道我哪里出错了。

非常感谢和问候

4

1 回答 1

2

首先，您使用的是 fancyBox 1.3.4，但您必须使用 fancyBox2 才能使用这些助手。

其次，检查你的路径是否正确，也许你应该从

..href="fancybox/source/..

到

..href="/fancybox/source/..
于 2012-04-27T12:34:15.873 回答