100 pictures in the folder image_1.jpg image_2.jpg, etc. all 100 are shown on the site:

<?php for ($i = 1; $i < 100; $i++) { echo'<img src="image_'.$i.'.jpg" onclick="model_pic('.$i.')">'; } ?>

It is necessary when you click on one of the pictures so that it opens another place on the page

 <div> <img src="image_'.НУЖНАЯ ЦИФРА.'.jpg"> </div>

preferably use only php and js

  • PHP has nothing to do with it. You definitely need JS for this purpose. - Samuel Loog
  • I would do something like this: for (var i = 1; i <100; i ++) {console.log ('<img src = "image_' + i + '.jpg" onclick = "model_pic (' + i + ') ">'); } - NeedHate

1 answer 1

 function foo(img) { var field = document.getElementById("xxx"); var x = document.createElement("IMG"); x.setAttribute("src", img); x.setAttribute("width", "90"); x.setAttribute("height", "90"); field.appendChild(x); } 
 lable { display: block; float: left; width: 100%; } div { display: block; position: absolute; top: 10%; left: 80%; } 
 <lable> <img src="http://www.neo2.es/blog/wp-content/uploads/jack2.jpg" onclick="foo('http://www.neo2.es/blog/wp-content/uploads/jack2.jpg')" width="70px" height="90px" />Click me!!</lable> <lable> <br> <img src="http://www.bargainbooze.co.uk/media/catalog/product/cache/1/image/320x320/9df78eab33525d08d6e5fb8d27136e95/2/1/2103_136.jpg" onclick="foo('http://www.bargainbooze.co.uk/media/catalog/product/cache/1/image/320x320/9df78eab33525d08d6e5fb8d27136e95/2/1/2103_136.jpg')" width="70px" height="90px" />Click me!!</lable> <lable> <br> <img src="http://gnf-group.com/wp-content/uploads/2013/03/brendy-slider.png" onclick="foo('http://gnf-group.com/wp-content/uploads/2013/03/brendy-slider.png')" width="70px" height="90px" />Click me!!</lable> <div id="xxx"></div>