如何在php中只显示第一张图片

时间:2015-11-27 13:01:28

标签: php css

我想要隐藏exept第一张图片,不需要使用而写入选择查询放置LIMIT 0,1对于我的情况我希望选择所有图像同时显示我想要的时间显示一个图像如何做到这一点

其实我正在使用photoswipe参考链接http://photoswipe.com/,这个插件显示所有图像,然后我们点击意味着它一个接一个地显示大尺寸的图像,对我来说不想这样,我想先显示一张图像然后我们点击它将逐个大尺寸的图像,

<div class="my-gallery" itemscope itemtype="">
<?php 
include('dbconfig.php');
$sql=mysql_query("SELECT ssmid, image  FROM user_timeline_photos");
while($row=mysql_fetch_assoc($sql)){
?>
<figure>
  <a href="img/cropped-images/<?php echo $row['image'];?>" itemprop="contentUrl" data-size="1600x1600">
      <img src="img/cropped-images/<?php echo $row['image'];?>" itemprop="thumbnail" alt="Image description" style='dispaly:none'/>
     //here i want to show that one image
  </a>
   <figcaption itemprop="caption description"><?php //echo'Upload Date'. $row['date_uploaded']?></figcaption>
</figure>
 <?php } ?>

4 个答案:

答案 0 :(得分:1)

最简单的方法是使用索引,例如$i

<div class="my-gallery" itemscope itemtype="">
<?php 

include('dbconfig.php');
$i = 0;
$sql=mysql_query("SELECT ssmid, image  FROM user_timeline_photos WHERE ssmid='$ssmid'");
while($row=mysql_fetch_assoc($sql)){
?>

 <figure <?php if(0 != $i) { ?>style="display:none;" <?php } ?>>
   <a href="img/cropped-images/<?php echo $row['image'];?>" itemprop="contentUrl" data-size="1600x1600">
      <img src="img/cropped-images/<?php echo $row['image'];?>" itemprop="thumbnail" alt="Image description" style='dispaly:none'/>
     //here i want to show that one image
   </a>
   <figcaption itemprop="caption description">
       <?php //echo'Upload Date'. $row['date_uploaded']?>
   </figcaption>
 </figure>

<?php $i++; } ?>

答案 1 :(得分:0)

您可以先使用css3:子元素来隐藏第一个图像,例如

  .images_container:first-child { 
        display:none;
    }

答案 2 :(得分:0)

你应该使用计数器。试试这个

 <div class="my-gallery" itemscope itemtype="">
    <?php 
    include('dbconfig.php');
    $sql=mysql_query("SELECT ssmid, image  FROM user_timeline_photos WHERE ssmid='$ssmid'");
    $count=0;
    while($row=mysql_fetch_assoc($sql)){
    ?>
    <figure <?php ($counter==0)?'style="display:none;"':NULL ?>>
      <a href="img/cropped-images/<?php echo $row['image'];?>" itemprop="contentUrl" data-size="1600x1600">
          <img src="img/cropped-images/<?php echo $row['image'];?>" itemprop="thumbnail" alt="Image description" />
         //here i want to show that one image
      </a>
       <figcaption itemprop="caption description"><?php //echo'Upload Date'. $row['date_uploaded']?></figcaption>
    </figure>
     <?php $count++; } ?>

答案 3 :(得分:0)

替代解决方案:

尽管@pinkalvansia为您提供了一个优雅的解决方案,但这是我的替代解决方案。

你可以简单地使用一个布尔变量(如$boolean)来检查它是否是第一个图像,并且在显示第一个图像之后,你只需要打开循环,因为如果你只想显示第一张图像然后没有点循环所有图像。

<div class="my-gallery" itemscope itemtype="">
<?php 
    include('dbconfig.php');
    $sql=mysql_query("SELECT ssmid, image  FROM user_timeline_photos WHERE ssmid='$ssmid'");

    $boolean = true;

    while($row=mysql_fetch_assoc($sql)){
        if($boolean){
            // show image here
            ?>
            <figure>
                <a href="img/cropped-images/<?php echo $row['image'];?>" itemprop="contentUrl" data-size="1600x1600">
                <img src="img/cropped-images/<?php echo $row['image'];?>" itemprop="thumbnail" alt="Image description" style='dispaly:none'/>
                </a>
                <figcaption itemprop="caption description"><?php //echo'Upload Date'. $row['date_uploaded']?></figcaption>
            </figure>
            <?php
            break;
        }
    } 
?>

甚至更好:

不是提取所有记录,而是只提取一条记录。

<div class="my-gallery" itemscope itemtype="">
<?php 
    include('dbconfig.php');
    $sql=mysql_query("SELECT ssmid, image  FROM user_timeline_photos WHERE ssmid='$ssmid'");
    $row=mysql_fetch_assoc($sql); // fetches only one record
?>
<figure>
    <a href="img/cropped-images/<?php echo $row['image'];?>" itemprop="contentUrl" data-size="1600x1600">
    <img src="img/cropped-images/<?php echo $row['image'];?>" itemprop="thumbnail" alt="Image description" style='dispaly:none'/>
    </a>
    <figcaption itemprop="caption description"><?php //echo'Upload Date'. $row['date_uploaded']?></figcaption>
</figure>