创意div css鼠标悬停图片细节放大显示代码



205 819 274



特效描述:鼠标悬停 图片细节放大,div css 图片细节放大,图片细节显示

代码结构

1. 引入CSS

<link href="css/style.css" rel="stylesheet" type="text/css" />

2. HTML代码

<div style="height:450px; margin:20px auto;" class="ktg">
	<img src="images/pro_1.jpg" height="450" width="960" />
	<ul>
		<li style="left:8px;top:137px;"><a target="_blank" title="太阳能热水袋" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:408px;top:50px;"><a target="_blank" title="太阳能太阳伞" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:705px;top:160px;"><a target="_blank" title="太阳能帐篷" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:20px; bottom:8px;"><a target="_blank" title="太阳能手电筒" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:108px; bottom:29px;"><a target="_blank" title="太阳能灯" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:278px; bottom:48px;"><a target="_blank" title="太阳能背包" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:458px; bottom:23px;"><a target="_blank" title="太阳能驱蚊器" href="http://www.17sucai.com/"><div></div></a></li>
		<li style="left:639px; bottom:37px;"><a target="_blank" title="太阳能七彩罐" href="http://www.17sucai.com/"><div></div></a></li>
	</ul>
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 右键菜单 文字提示框 提示框/弹出层 layer lightbox Tooltip工具提示框 浮动提示框 html5弹窗动画 弹出层拖动 窗口提示框

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到