<div id="product"<?# productStyle ?>>
	<div class="workframe">
		<div class="index-title wow">
			<h2><?# indexPTitle ?></h2>
			<p><a href="<?# indexPMLink ?>" title="<?# indexPMLinkTitle ?>"><?# indexPMLinkTitle ?><b><i class="fa fa-arrow-right"></i></b></a></p>
		</div>
		<div id="prolay" class="wow">
			<div class="pro-list">
				<php:repeater id="listP">
				<template>
				<div>
					<div class="p-box">
						<div class="p-info">
							<h3><a href="<?# link ?>" title="<?# ProductName ?>"><?# ProductName ?><b><i class="fa fa-angle-right"></i></b></a></h3>
							<p class="describe"><?# Introduction ?></p>
							<p class="price"<?# sellStyle ?>><span class="old"<?# oldPriceStyle ?>>原價<b><?# OldPrice ?></b>元</span><span<?# priceStyle ?>>特價<b><?# Price ?></b>元</span></p>
						</div>
						<div class="bgimg"><a href="<?# link ?>" title="<?# ProductName ?>"><img src="<?# IconImage ?>" alt="<?# ProductName ?>"></a></div>
						<img src="/images/14/p-blank.png" alt="<?# ProductName ?>">
					</div>
				</div>
				</template>
				</php:repeater>
			</div>
		</div>
	</div>
	<div id="w-particles"><div id="particles"></div></div>          
</div>
<script type='text/javascript' src='/jquery/14/jquery.particleground.min.js' defer="true"></script>
<script>
	$(function(){
		$('.p-box').hover(function(){
			$(this).addClass('p-boxOver');	
			$('.pro-list').addClass('sthOver');		
		},function(){
			$(this).removeClass('p-boxOver');	
			$('.pro-list').removeClass('sthOver');	
		});
		$('.pro-list').slick({
			slidesToShow: 3,
			slidesToScroll: 3,
			autoplay: true,
			autoplaySpeed: 4000,
			responsive: [{
				breakpoint: 1280,
				settings: { slidesToShow: 2,slidesToScroll: 2, }
			},{
				breakpoint: 768,
				settings: { slidesToShow: 1,slidesToScroll: 1, }

			}]
		});
		$('#particles').particleground({
			lineColor: 'rgba(255, 255, 255, 0.13)',
			dotColor: 'rgba(129, 193, 228, 0.43)', //痘痘的顏色
			particleRadius: 5, 
			minSpeedX:'0.7',
			directionY:'up'
		});
	});
</script>