程序员人生网站导航

各类CMS通用“鼠标触发”放大图片效果

栏目：DedeCMS时间：2013-12-25 18:45:12

　　先看一下代码，其中有css与html代码部分：

以下为引用的内容：
<title>liehuo.net</title>
<style>
/*定义CSS*/
div#resize a:hover{position: absolute; margin-left:-200px; float:left}
div#resize a img{width: 333px;}
div#resize a img{height: 180px;}
div#resize a:hover img{width: 666px;}
div#resize a:hover img{height: 378px;}
</style>

演示效果

<div id=resize>
<a href=http://www.veryhuo.com/ target=_blank><img src=http://www.veryhuo.com/uploads/allimg/090930/1_090930171900_1.jpg border=0></a>
</div>

　　如果你会CSS，可以做到更完美。

<title>liehuo.net</title><style>/*定义CSS*/div#resize a:hover{position: absolute; margin-left:-200px; float:left}div#resize a img{width: 333px;}div#resize a img{height: 180px;}div#resize a:hover img{width: 666px;}div#resize a:hover img{height: 378px;}</style>演示效果<div id=resize><a href=http://www.veryhuo.com/ _fcksavedurl="http://www.veryhuo.com/" target=_blank><img src=http://www.veryhuo.com/uploads/allimg/090930/1_090930171900_1.jpg _fcksavedurl="http://www.veryhuo.com/uploads/allimg/090930/1_090930171900_1.jpg" border=0></a></div><br /><center>网更多教程，请访问：<a href=http://www.veryhuo.com/ target=_blank _fcksavedurl="http://www.veryhuo.com/ target=_blank">http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

------分隔线----------------------------

上一篇 php验证邮箱地址合法性

下一篇 DEDECMS数据库配置文件在哪?如何进行配置

------分隔线----------------------------