增加圖像縮略圖的大小

以下代碼用於從數據庫檢索圖像並顯示在表格中！導入jquery和引導文件（用於實現lightbox模型來查看圖像）後，圖像的大小變小，但我不知道如何增加圖像的大小，因爲它們有點小！我如何糾正它？增加圖像縮略圖的大小

大小高度= 180和寬度= 150看跌期權的圖像不工作:(

<?php 
    require("includes/db.php"); 

    $sql="SELECT * FROM `order` "; 
    $result=mysqli_query($db,$sql); 
    echo"<head>"; 
    echo'//<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> 
      <link rel="stylesheet" href="css/jquery.gallery.css"> 

      <script src="http://code.jquery.com/jquery-3.1.0.min.js"></script> 
      <script type="text/javascript" src="js/jquery.gallery.js" ></script> 
      <script> 
       $(function() { 
        $(".simple_img_gallery").createSimpleImgGallery(); 
       }); 
      </script>'; 
    echo"</head>"; 

    echo "<body bgcolor=#E6E6FA>"; 
    echo "<table border=1 cellspacing=0 cellpadding=4 > " ; 
    while($row=mysqli_fetch_array($result)) 
    { 
     echo '<div class="simple_img_gallery">'; 
     echo '<a href='.($row['Image1']).' >'; 
     echo "<img id='myImg1' src='" .$row['Image1']. "' height='180' width='150' class='lightbox' />"; 

     echo "</a>"; 
     echo"</div>"; 

     echo "<br>"; 
     echo"</td>"; 
     echo"<td align=center >"; 


     if($row['Image2']=="No copy"){ 
      echo "No copy"; 
     }else{ 
      echo '<div class="simple_img_gallery">'; 
      echo '<a href='.($row['Image2']).'>'; 
      echo "<img id='myImg1' src='" .$row['Image2']. "' height='180' width='150' class='lightbox' />"; 

      echo "</a>"; 
     } 

     echo "<br>"; 
     echo"</td>"; 
     echo"<td align=center >"; 

     if($row['Image3']=="No copy"){ 
      echo "No copy"; 
     }else{ 
      echo '<div class="simple_img_gallery">'; 
      echo '<a href='.($row['Image3']).' >'; 

      echo "<img id='myImg1' src='" .$row['Image3']. "' height='180' width='150' class='lightbox' />"; 

      echo "</a>"; 
     } 

     echo "<br>"; 
     echo"</tr>"; 
     echo "</div>"; 
    } 
    echo"</body>"; 
    echo "<script type='text/javascript'> 

    var _gaq = _gaq || []; 
    _gaq.push(['_setAccount', 'UA-36251023-1']); 
    _gaq.push(['_setDomainName', 'jqueryscript.net']); 
    _gaq.push(['_trackPageview']); 

    (function() { 
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
    })(); 


</script>" 

?>

來源

2016-09-25 Kasun Sampath

一些明智的代碼縮進將是一個好主意。它可以幫助我們閱讀代碼，更重要的是，它可以幫助您**調試您的代碼** [快速瀏覽編碼標準]（http://www.php-fig.org/psr/psr-2/ ）爲了您自己的利益。您可能會被要求在幾周/幾個月內修改此代碼，最後您會感謝我。 – RiggsFolly

同時顯示「lightbox」類的CSS（如有必要，請查找） –

如何獲取所需大小的圖像？ –

看起來你被CSS限制你的圖像大小。這就是說，你的瀏覽器知道約180x150大小，但它重新渲染根據您的CSS規則

速戰速決是：

echo "<img id='myImg1' src='" .$row['Image1']. "' height='180' width='150' class='lightbox' style="height: 180px; width: 150px;" />";

無論如何，請看看你的CSS，並在那裏修復它。

來源

2016-09-26 07:38:00

增加圖像縮略圖的大小

回答

相關問題