Gallery

Description

To make the gallery work tms-0.4.x.js and uCarausel.js files are used

The HTML Structure of Gallery

<div id="simple_gallery">			  	
	<div class="gallery_bg">
		<div class="simple_gallery">
			<ul class="items">
				<li>
					<img src="YourImage.jpg" alt="" />
					<div class="banner">banner content</div>
				</li>
				...
			</ul>
		</div>
	</div>
	<div class="pag">
		<div class="img-pags">
			<ul>
				<li><a href="#"><span><img src="YourThumbs.jpg" alt="" /></span></a></li>
				...
			</ul>
		</div>
		<a href="#" class="btn prev button3" data-type="prevPage"><span></span></a>
		<a href="#" class="btn next button4" data-type="nextPage"><span></span></a>
	</div>
</div>

To add new images to the gallery you should have 2 images: 1 for the slider and 1 thumbnail. You need to add these images to different places. The images and thumbnails are connected by the order number. So the first thumbnail in the block <div class="img-pags"> will display on click the first image in the list <ul class="items">.

Slider image should be added to the list <ul class="items"> using the code:

<li>
	<img src="YourImage.jpg" alt="" />
	<div class="banner">banner content</div>
</li>

Thumbnail image should be added to the block <div class="img-pags"> using the code:

<li><a href="#"><span><img src="YourThumbs.jpg" alt="" /></span></a></li>

You'll get more info on working with Gallery in the template manual after purchase. Manual is located in the "documentation" folder of the template package.