Gallery图片显示顺序异常求助：点击相册后图片倒序展示

我来帮你搞定这个Lightbox图片倒序的问题，其实根源就在DOM元素顺序和数据库查询排序上：

问题原因拆解 #

你现在的代码是先生成所有图库图片的隐藏a标签，再把相册封面的a标签放在最后。Lightbox是按照DOM里a标签的出现顺序来分组的，而你点击的封面刚好是组里的最后一个元素，所以打开后会从最后一张图片开始展示，翻页自然就变成倒序了。另外你的数据库查询没指定排序规则，MySQL默认的返回顺序也可能不是你想要的正序，这也会加重顺序混乱的问题。

具体修改方案 #

1. 调整DOM元素顺序 #

把相册封面的a标签移到所有图库图片a标签的前面，让它成为Lightbox组的第一个元素，这样点击封面后就会从第一张图片开始展示。

2. 给数据库查询添加排序规则 #

在查询图库图片时加上ORDER BY子句，确保从数据库取出的图片是正序排列（假设你的Gallery_image表有自增主键id，用它来排序最稳妥）。

修改后的完整代码 #

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/lightbox-plus-jquery.min.js"></script>
<div class="menu-port">
<div class="container">
<div class="menu-grid-main">
<?php 
// 数据库连接只需要引入一次，不要在循环里重复引入
include("database/connection.php");
$result=mysql_query("SELECT * from Album_image where status='process'");
while ($row1= mysql_fetch_array($result)) { 
?>
<div class="col-md-4 menu-grid wow bounceInDown" data-wow-delay="0.3s">
    <!-- 先放封面a标签，作为Lightbox组的第一个元素 -->
    <a href="admin/acatch/<?php echo $row1['image'] ?>" data-lightbox="<?php echo $row1['name']?>" >
        <img src="admin/acatch/<?php echo $row1['image'] ?>" alt="" class="img-responsive">
    </a>

    <!-- 循环生成图库图片的隐藏a标签，指定正序排序 -->
    <?php 
    $result1=mysql_query("SELECT * from Gallery_image where aid=$row1[aid] ORDER BY id ASC");
    while ($row2= mysql_fetch_array($result1)) { 
    ?>
    <a href="admin/gcatch/<?php echo $row2['image'] ?>" data-lightbox="<?php echo $row1['name']?>" ></a>
    <?php }?>

    <h3><?php echo $row1['name']?></h3>
    <p><?php echo $row1['des']?></p>
</div>
<?php }?>
<div class="clearfix"></div>
</div>
</div>
</div>

额外优化提示 #

• 我帮你去掉了循环里重复的include("database/connection.php");，重复引入会创建多余的数据库连接，影响页面性能。
• 修正了你代码里admin/gcatch//多出来的斜杠，改成了规范的admin/gcatch/，避免路径错误。
• 注意：mysql_*系列函数已经被PHP官方废弃了，建议尽快迁移到mysqli或PDO，避免后续版本兼容性问题。

内容的提问来源于stack exchange，提问作者Arebhy Sridaran

这样修改后，点击相册封面就能从第一张图片开始正序展示了，翻页也会是正常的顺序~