test změna url img při kliku

by Petr Haluza

HTML

<div id="test"></div>

<div class="box">
  <img src="https://www.hal3000.cz/www/_pub/images/pchs2624/Image_01.jpg" />
</div>

<div class="box">
  <img src="https://www.hal3000.cz/www/_pub/images/pchs2624/Image_01.jpg" />
</div>

<div class="box">
  <img src="https://www.hal3000.cz/www/_pub/images/pchs2624/Image_01.jpg" />
</div>

CSS

.box {
  height: 200px;
  width: 200px;
  background: lightBlue;
  margin: 20px auto; 
  overflow: hidden;
  position: relative;
}
img {width:100%}
img:before {content:"..."; display:block; min-width:100%; min-height:100%; position: absolute;}

JavaScript

window.nr = 1;
$("#test").text(window.nr);

$("img").click(function(){
  window.nr = window.nr + 1;
  $("#test").text(window.nr);
  
  if (window.nr > 14) {
    window.nr = 1;
  }

   if (window.nr < 9) {
     val = "0" + window.nr;
   } else {
     val = window.nr;
   }
   var src = $(this).attr('src');
   $(this).attr('src', "https://www.hal3000.cz/www/_pub/images/pchs2624/Image_" + val + ".jpg");
});