在PHP中,如何在点击时缩小缩略图?

时间:2015-10-06 00:07:25

标签: php

以下是我必须将它们显示为缩略图:

 <?php
   $imageArray = array();
   $imageArray ["rat.png"] = "Rat";
   $imageArray ["ox.png"] = "Ox";
   $imageArray ["tiger.png"] = "Tiger";
   $imageArray ["rabbit.png"] = "Rabbit";
   $imageArray ["dragon.png"] = "Dragon";
   $imageArray ["snake.png"] = "Snake";
   $imageArray ["horse.png"] = "Horse";
   $imageArray ["sheep.png"] = "Sheep";
   $imageArray ["monkey.png"] = "Monkey";
   $imageArray ["rooster.png"] = "Rooster";
   $imageArray  ["dog.png"] = "Dog";
   $imageArray ["pig.png"] = "Pig";

   echo"<table><tr>";
   foreach($imageArray as $img => $value){
    echo"<td>"?><a href="LargeImage.php?img=<?= $img ?>"><img src="
    img/<?= $img?>"
    alt="<?= $value ?>" height = '50' width='25' /></a></td>
    <?php };
    echo "</tr></br>";  
    ?>

现在我希望他们在点击时返回原始大小。任何帮助 谢谢,谢谢!

1 个答案:

答案 0 :(得分:1)

作为服务器端脚本语言,PHP无法做您想做的事情,但它可以提供可行的客户端脚本。实现此效果的最佳方法是通过javascript使用jQuery库。

以下是一些示例代码,可以在点击时切换图片大小:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $("img").on("click",function(){
        if($(this).height() == 50){
            $(this).css("height","100px");
            $(this).css("width","50px");
        }
        else{
            $(this).css("height","50px");
            $(this).css("width","25px");
        }
    });
});
</script>