Images gallery not working

[Abdul Kadir]

Abdul Kadir

March 16, 2017 at 7:52 pm

Hi,

I have created a test page for my store location here. Currently the images are test images, but the main image is supposed to change when clicking on the thumbnail. A working example can be viewed here

I have used the following code in the page.

<h2 class=”store_title” style=”font-size: 20px;”>Royapettah</h2>
<div class=”store_img_main”>
<div class=”photo”></div>
<div class=”store_image clearfix” style=”margin-left: -15px;”>
<div class=”store_img_thumbs”> </div>
<div class=”store_img_thumbs”> </div>
<div class=”store_img_thumbs”> </div>
<div class=”store_img_thumbs”> </div>
<div class=”store_img_thumbs”> </div>
</div>
</div>

and the following styling

/* our stores page formatting start */

.branch_contents .store_img_main , .branch_contents .store_img_main1 {
border-right: 1px solid #ddd;
float: left;
/*height: auto; */
min-height: 350px;
width: 47%;
}

.branch_contents .google_maps {
float: left;
height: auto;
margin-left: 30px;
width: 450px;
}

.branch_contents {
height: auto;
/* margin-left: 20px; */
}
.addr_branch {
margin-top: 10px;
}

.branch_contents .store_image {
display: inline-block;
margin-top: 5px;
width: 100%;
}
.store_image .store_img_thumbs {
margin: 0;
padding: 0 15px;
}
.store_image .store_img_thumbs > a {
float: left;
margin: 0 10px 0 0;
width: 16%;
}

.branch_contents .store_image {

margin-bottom: 10px;
}

.branch_contents .store_img_main , .branch_contents .store_img_main1 {
width: 100% !important;
border-right: none !important;

}

/* our stores page formatting end */

this styling is exactly as per the old page, but its just not working right..