fancyBox画廊
fancyBox画廊
提问于 2012-04-26 13:55:48
我想知道是否有人能帮我。
首先，我为大多数人可能觉得这是一个非常简单的问题而道歉。但这是我的第一次尝试，所以请容忍我。
我正在使用下面的脚本创建一个图像库与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/jquery.mousewheel-3.0.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">
$(document).ready(function() {
$("a.fancybox-thumb").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false
});
});
</script>
</head>
<body style="font-family: Calibri; color: #505050; font-size: 9px; border-bottom-width: thin; margin-top: 5px; margin-left: 100px; margin-right: 100px; margin-bottom: -10px; float: left; position: absolute;">
<div align="right" class="style1"> <a href = "javascript:document.gallery.submit()"/> Add Images <a/> ← View Uploaded Images </div>
<form id="gallery" name="gallery" class="page" action="index.php" method="post">
<?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-thumb" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>
</form>
</body>
</html> 我可以查看图片，但我似乎无法让画廊的功能发挥作用。我一直在研究“fancyBox”和“fancyApps”网站上的例子，但很明显，我一直误解了一些东西。
我觉得，一旦我开始，我可以格式化的页面，因为我需要它看，我将只是工作的教程。但我只是想知道是否有人能告诉我，我在创建最初的画廊时出了什么问题。
非常感谢和问候
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-04-26 15:31:08
在“内核恐慌”、“ryan”和“@Mr_DeLeTeD”提出的最初问题被纠正后，通过进一步的测试和查阅文档，“灰色垂直条纹”是不透明设置，而不是错误。
Stack Overflow用户
发布于 2012-04-26 14:03:03
我将您的fancybox附加到一个名为“.fancybox-拇指”的类中，但是页面上却没有这样的类。相反，您的链接包含名为".images“的类。
所以试着替换这一行
<a class="images" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>使用
<a class="fancybox-thumb" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>我还没有测试您的代码，但这是我到目前为止发现的一个明显错误。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/10334956
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号