图片与更多信息在下一页


Images with more info on the next page

图像存储在我的文件夹中,而不是在数据库中。当我点击其中一张图片时,它会引导我在下一页看到更多信息。这意味着我可以看到更大尺寸的图像。

我如何做到这一点与更少的php页面创建?下面是我的代码片段

<table>
<tr> 
<th class="timgB"><h4><img src="city/GVcementMixture.jpg" style="vertical-align: text-bottom;" title="Cement Mixture"/> Cement Mixture </a></h4></th>
</tr> 
</table>

可以将其全部保存在一个表单/页面中,使用一个大的if/else或switch/case语句来评估所选图像,并仅显示与所选图像有关的信息,例如全尺寸图像或子图像的子集。但最好还是用jQuery来呈现,就像@Razor说的那样。

<form ...>
    <button type=submit name=imgID value=1>
    <button type=submit name=imgID value=2>
    ...
<?php
    if (isset($_POST['imgID'])):
        // Show info related to selected image
        ...

你可以这样做。使用class="small使图像变小,使用class="big-img"使图像变大。链接中的?img=img23.jpg决定哪个图像应该用大尺寸显示。或者如果您使用图像的缩略图作为小尺寸,并希望显示一个完整的尺寸,只有当有人点击缩略图,然后更新链接在div (class="big-img")或留下评论。

//它会按你想要的运行

<body>
    <div class = "big-img"> <!-- set class to show big size image-->
        <?php if(isset($_GET['img'])): ?>
            <img src="city/.<?php echo $_GET['img']; ?>" alt="">
        <?php endif; ?> 
    </div>
     <table>
        <tr><!-- set class to show small size image-->
            <td class = "small"><a href="?img=img23.jpg"><img src="city/img23.jpg" alt=""></a></td>
            <td class = "small"><a href="?img=img24.jpg"><img src="city/img24.jpg" alt=""></a></td>
            <td class = "small"><a href="?img=img25.jpg"><img src="city/img25.jpg" alt=""></a></td>
        </tr>
     </table>
</body>