经典鼠标感应图片切换特效，这个是模仿某讯官方网站上面的，当用户的鼠标滑过标题时改变方向，可自己修改。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-cn" />
<meta name="keywords" content="武鸣人网站,武鸣信息网,武鸣本地网,武鸣信息资源平台,减肥,健身,励志,励志语录,js特效,网页特效,www.wuming.ren">
<meta name="description" content="欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。">
<title>网站经典实用鼠标感应图片切换js特效代码_武鸣人</title>
<style type="text/css">
body, div{padding:0; margin:0;}
img{border:0;}
ul{list-style:none;}
body{background:#FFF; min-width:996px; font:12px/18px Verdana, Simsun, Helvetica, Arial, sans-serif; color:#595959; text-align:center;}
/* slider */
.slider_show{position:relative; width:530px; height:207px; margin:2px auto 10px auto;}
.contentslider{width:530px; height:181px; overflow:hidden;}
.contentslider img{width:530px;height:181px;}
.pagination{height:26px;}
.pagination a{float:left; background:url(/img/20240305_www_wuming_ren_1.png) no-repeat -220px -70px; width:106px; height:26px;line-height:26px;overflow:hidden; word-break:keep-all; white-space:nowrap;text-align:center; }
.pagination a.selected{background:url(/img/20240305_www_wuming_ren_1.png) no-repeat -330px -70px; color:#cd0000; font-weight:bold;}
.pagination a:hover, .pagination a:active{text-decoration:none;}
.slider_line_l{position:absolute; top:183px; background:url(/img/20240305_www_wuming_ren_1.png) no-repeat -220px -42px; width:2px; height:26px;}
.slider_line_r{position:absolute; right:0; top:183px; background:url(/img/20240305_www_wuming_ren_1.png) no-repeat -748px -42px; width:2px; height:26px;}
</style>
</head>
<body>
<a href="https://www.wuming.ren">武鸣人</a>，各种信息资源免费发布，分享励志语录经典短句，减肥健身常识，各种js特效代码。网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>
需要加载js文件，请刷新页面后看效果<br />
<div id="slider" class="slider_show">
<div class="contentslider">
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash1'});}catch(e){}"><img src="/img/20240305_www_wuming_ren_2.jpg" width="530" height="181" alt="" /></a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash2'});}catch(e){}"><img src="/img/20240305_www_wuming_ren_3.jpg" width="530" height="181" alt="" /></a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash3'});}catch(e){}"><img src="/img/20240305_www_wuming_ren_4.jpg" width="530" height="181" alt="" /></a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash4'});}catch(e){}"><img src="/img/20240305_www_wuming_ren_5.jpg" width="530" height="181" alt="" /></a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash5'});}catch(e){}"><img src="/img/20240305_www_wuming_ren_6.jpg" width="530" height="181" alt="" /></a>
</div>
<div class="pagination" id="paginate_slider">
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash1'});}catch(e){}">开年费拿500人群</a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash2'});}catch(e){}">DNF狂欢送大礼</a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash3'});}catch(e){}">vip7万元大礼包</a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash4'});}catch(e){}">拉住ta迈向幸福</a>
<a href="https://www.wuming.ren" target="_blank" onclick="try{pgvSendClick({hottag:'vip.portal.index.flash5'});}catch(e){}">极品靓号</a>
</div>
<div class="slider_line_l"></div>
<div class="slider_line_r"></div>
</div>
<script type="text/javascript">
document.write('<script type="text/javascript" src="https://www.wuming.ren/img/20240305_lib.js?ver=20110614"><\/script>');
document.write('<script type="text/javascript" src="https://www.wuming.ren/img/20240305_common.js"><\/script>');
</script>
<script type="text/javascript">
QQVIP.ui.SlideView("slider", {effect: 'scrollx', navWrapper:"paginate_slider", navClassOn:'selected'});
</script>
</body>
</html>本文来自武鸣人网站，转载请注明出处