2016-09-25 5 views
0

다음 코드는 데이터베이스에서 이미지를 검색하고 표에 표시하는 데 사용됩니다! 이미지를보기 위해 라이트 박스 모델을 구현하는 데 사용되는 jquery 및 부트 스트랩 파일을 가져온 후 이미지 크기는 작아졌지만 조금 작기 때문에 이미지 크기를 늘리는 방법을 모른다. 어떻게 해결할 수 있습니까?이미지의 축소판 크기를 늘립니다.

크기 높이 = 180 및 이미지 폭 = 150 풋은 CSS로 이미지 크기를 제한하는 것 같은 작업 :(

<?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>" 

?> 

enter image description here

+1

현명한 코드 들여 쓰기가 좋은 생각입니다. 이 코드는 코드를 읽는 데 도움이되며 더 중요한 것은 ** 코드를 디버깅하는 데 도움이됩니다 ** [코딩 표준을 간략히 살펴보십시오] (http://www.php-fig.org/psr/psr-2/) 자신의 이익을 위해. 몇 주/몇 달 후에이 코드 을 수정하라는 메시지가 표시 될 수 있으며 결국 나에게 감사 할 것입니다. – RiggsFolly

+0

또한 'lightbox' 클래스의 CSS를 보여줍니다 (필요한 경우 찾으십시오) –

+0

어떻게 필요한 크기의 이미지를 얻을 수 있습니까? –

답변

0

이 보이는니까. 말했다 브라우저를 는 CSS 규칙에 따라에 대한 180x150 크기를 알고 있지만, 그것을 rerenders

빠른 수정은 다음과 같습니다.

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

어쨌든 CSS를보고 고쳐주세요.

관련 문제