Redirect image to post url - php

Question

I've seen some websites in google images when you click "open image in new tab" it redirects to the url of the original post.
I have my website that has a lot of images created with php gd which take the data from the post and create the image, the url it's similar to this:
example.com/img/(number-post-id)-some-text.jpg
and the post its
example.com/post/(number-post-id)
It's there a way to redirect the images to the original post when somebody open the image in a new tab?
thanks

Answer 1

/* add a little bottom space under the images */
.thumbnail {
margin-bottom:7px;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet"/>
<div class="container">
<h1>Image Grid</h1>
<b> NOTE: </b> Try To Open With <kbd>`Right Click`</kbd> <b> > </b> <kbd> `Open Link In New Tab`</kbd> Or .. With
<kbd>Ctrl<kbd> + <kbd> Click<kbd>
<hr>
<div class="row">
<div class="col-xs-3">
<a href="https://www.google.com" class="thumbnail"> Google
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="https://www.facebook.com" class="thumbnail"> facebook
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="https://www.stackoverflow.com" class="thumbnail"> stackoverflow
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="www.yahoo.in" class="thumbnail"> yahoo.in
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
<div class="col-xs-3">
<a href="#" class="thumbnail">
<img src="http://placehold.it/350x150" class="img-responsive">
</a>
</div>
</div>
<hr>
</div>

Answer 2

From what I understood, this is a snippet that should solve your q:
<a href="http://example.com/imagelink" target="_blank"> <!-- target _blank opens in new tab-->
<img src="http://example.com/image.extension">
</a>