CSS3垃圾分类导航旋转特效代码下载


CSS3垃圾分类导航旋转特效代码下载
CSS3垃圾分类导航旋转特效代码下载以及垃圾分类、导航旋转等js/jquery网页特效代码下载。

1. 引入CSS

<link rel="stylesheet" href="css/main.css">

2. 引入JS

<script type="text/javascript" src="js/min.js"></script>

3. HTML代码

<div class="box">
	<div class="circleCenter" id="circlecenter">
		<div class="bgBox">
			<img src="img/bg.jpg">
		</div>
		<div class='rotation-turn'>
			<div class='rotation-item'>
				<div class="rotation-animat">
					<img src="img/img1.png">
				</div>
			</div>
		</div>
		<div class='rotation-turn'>
			<div class='rotation-item'>
				<div class="rotation-animat">
					<img src="img/img2.png">
				</div>
			</div>
		</div>
		<div class='rotation-turn'>
			<div class='rotation-item'>
				<div class="rotation-animat">
					<img src="img/img3.png">
				</div>
			</div>
		</div>
		<div class='rotation-turn'>
			<div class='rotation-item'>
				<div class="rotation-animat">
					<img src="img/img4.png">
				</div>
			</div>
		</div>
		<div class='rotation-turn'>
			<div class='rotation-item'>
				<div class="rotation-animat">
					<img src="img/img5.png">
				</div>
			</div>
		</div>
	</div>
</div>
<script>
	var option = {
		radius:200,      //大圆半径
		focusindex:5,  //焦点图位置
		speed:800,       //旋转速率,单位(毫秒)
		callback:function(ele,index){   //this指向此rotation对象
		}
	}
	var rotation = new Rotation("circlecenter",option);
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>

相关推荐

发表评论

相关文章