灯箱“下一个”和“上一个”怎么样?

时间:2013-11-21 07:25:51

标签: javascript php css gallery lightbox

我想展开“下一步”按钮的Lightbox图库和“prev”按钮。请帮忙!

清单:

<?php
$result = mysql_query("SELECT * FROM uploads WHERE gal='$gallery' ORDER BY id ASC");
while ($galrow = mysql_fetch_array($result)) {
?>

<a href="javascript:void(0);" onclick="document.getElementById('underlay').style.display='block'; document.getElementById('lightbox').style.display='block'; document.getElementById('lightbox-img').src = 'gal/<?php echo $gallery . '/' . $galrow ['image']; ?>';">
<?php
echo '<img src="gal/' . $gallery . '/' . $galrow['image'] . '" />';
?>
</a>

<?php
}
?>

显示:

<div id="underlay">

</div>

<div id="lightbox">
<img src="" alt="" id="lightbox-img"/>
<a href="javascript:void(0);" onclick="document.getElementById('underlay').style.display='none'; document.getElementById('lightbox').style.display='none';">X</a>

<a href="?">Next button</a>
<a href="?">Prev button</a>

</div>

1 个答案:

答案 0 :(得分:0)

我自己从未尝试过,但我相信。最简单的方法是将带有CSS的原始nextprevious按钮移动到您想要的位置。然后只需改变它的外观即可。

以下是关于如何做到这一点的良好开端:http://answers.squarespace.com/questions/4375/how-can-i-customize-the-next-and-previous-buttons-in-the-lightbox-gallery-mode