jquery图片九宫格布局鼠标经过遮罩显示文字特效代码下载


jquery图片九宫格布局鼠标经过遮罩显示文字特效代码下载
jquery图片九宫格布局鼠标经过遮罩显示文字特效代码下载以及图片九宫格布局、鼠标经过、遮罩显示文字等js/jquery网页特效代码下载。

1. 引入JS

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

2. HTML代码

<dl class="sgw_img">
	<dt>
		<img src="images/t1.png" width="315" height="382"/>
		<div class="box">
			<h3>揭秘化妆水四大隐藏功效</h3>
			<p>介绍...</p>
			<a href="https://www.51qianduan.com/">51前端</a>
		</div>
	</dt>
	<div class="sgw_img_dd1">
		<dd>
			<img src="images/t2.png" width="196" height="125"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd id="dd2">
			<img src="images/t3.png" width="196" height="126"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd>
			<img src="images/t4.png" width="196" height="125"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
	</div>
	<div class="sgw_img_dd2">
		<dd id="dd5">
			<img src="images/t5.png" width="284" height="172"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd id="dd3">
			<img src="images/t6.png" width="176" height="172"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd>
			<img src="images/t7.png" width="152" height="207"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd>
			<img src="images/t8.jpg" width="152" height="207"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
		<dd id="dd4">
			<img src="images/t9.png" width="152" height="207"/>
			<div class="box">
				<h3>标题</h3>
				<p>介绍...</p>
				<a href="https://www.51qianduan.com/">51前端</a>
			</div>
		</dd>
	</div>
</dl>

相关推荐

发表评论

相关文章