Get HTML

Get CSS

Get JS

Product grid view with zoom effect

2903 06 October 2019

No Description Available

Abhishek Singh

~ onex

Related Elements

3683
1
0

Owl Carousel 2 - autoplay/loop

onex

13389
1
0

Slick marquee slider - manage HTML marquee with slick javascript library.

Slick Carousel Marquee Demo

onex

2243
0
0

Product Slider using Owl carousel 2 with auto play and responsiveness.

Product Slider

onex

2186
1
0

Owl Banner slider

onex

2131
1
0

Bx-slider demo

onex

1935
0
0

Owl Carousel is a number one jQuery plugin Choosen by hundreds of developers. Here is Sponsored Slider.

Owl Carousel demo Sponsored

onex

1911
1
0

Transparent Slider demo

onex

1706
0
0

Owl caraousel Testimonial slider

Client Testimonial

onex

<div class="container">
		<div class="row">
			<div class="latest-products">
				<h3 class="text-center">LATEST PRODUCTS</h3>
				<p class="text-center" style="font-size:16px;"><i>dNam ac egestas est. Mauris et pulvinar risus, at tincidunt lorem. Maecenas</i><br>
				tristique sit amet odio sit amet aliquet.</p>
			
			<div class="row marg-top">
				<div class="col-md-3">
					<div class="thumbnail">
						<div class="image-zoom">
						<img src="https://pcbonlineshop.com/photos/product/4/176/4.jpg" class="img-responsive"></div>
						<h4 class="text-center" style="padding-top: 10px;">PRODUCT TITLE</h4>
						<center> <span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span> </center>
						<h4 class="text-center"><del>$200</del> $150</h4>
					</div>
			</div>
				
				<div class="col-md-3">
					<div class="thumbnail">
						<div class="image-zoom">
							<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTNQ4P6yy-qFEdTpC38EH2YGDa5lCNTIwJf1oo-FEyPmv3-2FJk" class="img-responsive">
						</div>
						<h4 class="text-center" style="padding-top: 10px;">PRODUCT TITLE</h4>
						<center> <span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span> </center>
						<h4 class="text-center"><del>$200</del> $150</h4>
					</div>
				</div>
				
				<div class="col-md-3">
					<div class="thumbnail">
						<div class="image-zoom">
							<img src="https://cdn.cultofmac.com/wp-content/uploads/2017/03/iPhone-7-red-1-780x466.png" class="img-responsive">
						</div>
						<h4 class="text-center" style="padding-top: 10px;">PRODUCT TITLE</h4>
						<center> <span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span> </center>
						<h4 class="text-center"><del>$200</del> $150</h4>
					</div>
				</div>
				
				<div class="col-md-3">
					<div class="thumbnail">
						<div class="image-zoom">
							<img src="http://www.edwardshaw.co.uk/wp-content/uploads/2012/03/garment-product-photograph-13953r.jpg" class="img-responsive">
						</div>
						<h4 class="text-center" style="padding-top: 10px;">PRODUCT TITLE</h4>
						<center> <span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span>
						<span class="fas fa-star fa-lg star-color"></span> </center>
						<h4 class="text-center"><del>$200</del> $150</h4>
					</div>
				</div>
			</div>
		</div>
	</div>
	</div>

Get HTML

Get CSS

Get JS

Product grid view with zoom effect

Abhishek Singh

Related Elements

Resourse

Log in