Hi, I was wondering if someone could give me a little help.
I am creating a website for a family member and am using a template (electrix) from w3layouts.com.
The issue I am having is that I am not sure if or how to have a text caption on the full size image.
Here is the HTML for a picture in the gallery
So the “a href” image is the full size image and the image in the “img src” is the thumb size. I do know that I can place text in the div class="link-top" but it appears over the thumb image and not the large one.Code:<div class="col-md-3 img-top "> <a href="images/cat-1.png"> <img src="images/cat-1.png" class="img-responsive" alt=""> <div class="link-top"> </div> </a> </div>
I know I could use the alt tag but I want a constant view, not just on a mouse over, and also larger display.
One thing that has me confused is the large image is a (a href) link and the thumb image is a regular img src. I would think that it has to do with “jquery.flexslider.js” file and the way the gallery operates.
Currently the gallery only requires one size for the images and resizes it for the thumb page. I have made a second copy of each image and added a layer with the text caption on it, but I do have 100 + images and if they need to be changed or have a mistake… I have to go recreate the image in photoshop, so not the most user friendly way.
Also, the sight is not yet published as it is not complete. As soon as I sort out this issue, my wife will be switching it into French Canadian.
Any insight and help would be greatly appreciated.