PHP галерея автоматически сгенерированный большой палец, чтобы открыть увеличенное изображение в <div> по клику

Question

Извините заранее, если это глупый вопрос, но я новичок, и это первый фрагмент PHP, который я когда-либо видел в своей жизни.

Я взял код из этого поста о создании галереи изображений из папки изображений автоматически, и она создает галерею миниатюр, при нажатии на которую открывается увеличенное изображение на отдельной странице.

Я хотел бы, чтобы миниатюры открывали увеличенное изображение внутри div на той же странице.

Мне удалось добиться этого с помощью "iframe", но я знаю, что это решение, которое осуждается:

<iframe id="r5-6c2-4" name="bigimg" src="" width="625px" height="410px" frameBorder="0">
</iframe> 

<div id="r5-6c1">
     <div id="thumbscontainer">
         <ul>
             <?php
                  $images = glob('g-images/*.jpg');
                  $ignore = array('cgi-bin', '.', '..','._');
                  foreach($images as $curimg){
                  if(!in_array($curimg, $ignore)) {
                  echo "<li><a href='".$dirname.$curimg."' target='bigimg'><img src='thumby.php?src=".$dirname.$curimg."&h=193&zc=0' alt='' /></a></li>\n ";
                   }
               }                 
               ?>                    
           </ul>
     </div>          
</div>

Помогите, пожалуйста!:-)

Answer 1

Я тоже новичок, но я бы попробовал это,

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function() {           
    $('body').append('<div><img id="moo" src=""></div>');
    $("a[target='bigimg']").on('click',function(a){
      a.preventDefault();
      $('img#moo').attr('src',$(this).attr('href'));
    }); 
});
</script>