商城常用鼠标经过商品分类加亮显示特效

7个月前 (05-17 16:33)阅读回复0
大陆
大陆
  • 管理员
  • 发消息
  • 注册排名1
  • 经验值5294
  • 级别管理员
  • 主题1058
  • 回复2
楼主

商城网站常用的鼠标经过商品分类时，图层加亮特效，这个是目前大部分商城网站都在用的图层加亮特效，结合自己的需求修改即可。

<!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 name="keywords" content="武鸣人网站,武鸣信息网,武鸣本地网,武鸣信息资源平台,减肥,健身,励志,励志语录,js特效,网页特效,www.wuming.ren">
<meta name="description" content="欢迎来到武鸣人信息资源平台，各种信息免费发布，资源共享合作共赢，分享互联网流行的励志语录经典短句，减肥健身健康小常识及打卡记录，收集各种js特效代码。">
<title>商城常用鼠标经过商品分类加亮显示特效_武鸣人</title>
<style type="text/css">
<!--
body {
font-size: 12px;
}
#shone1,#shtwo1 {
text-align: center;
padding: 9px;
}
.huixuxian {
border-bottom-width: 1px;
border-bottom-style: dashed;
border-bottom-color: #CCCCCC;
}
.huixuxian ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
.huixuxian li {
padding-top: 2px;
padding-bottom: 2px;
margin-top: 2px;
margin-bottom: 2px;
background-color: #F3F3F3;
}
.huixuxian li.hover {
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #FF0000;
padding-top: 2px;
padding-bottom: 2px;
margin-top: 2px;
margin-bottom: 2px;
border-top-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-left-style: solid;
border-top-color: #FF0000;
border-left-color: #FF0000;
background-color: #FFFFFF;
}
#www_wuming_ren,#apDiv4 {
position:absolute;
z-index:3;
visibility: hidden;
}
#apDiv3,#apDiv6 {
position:absolute;
z-index:2;
border: 2px solid #FF0000;
visibility: hidden;
background-color: #FFFFFF;
margin-top: 2px;
margin-left: 0px;
}
-->
</style>
<script type="text/javascript">
<!--
function setOver(name,cursel,n){
for(i=1;i<=n;i++){
var menu=document.getElementById(name+i);
menu.className=i==cursel?"hover":"";
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
}
function setOut(name,cursel,n){
for(i=1;i<=n;i++){
var menu=document.getElementById(name+i);
menu.className=i==cursel?"":"hover";
}
}//武鸣人网站https://www.wuming.ren 网站很好记住，wuming.ren(武鸣拼音.ren域名后缀)
function MM_showHideLayers() { //v9.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3)
with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</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>
<table width="700" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="64" class="huixuxian">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="7%">
<div id="www_wuming_ren">
<ul>
<li id="shone1" onmouseover="setOver('shone',1,1);MM_showHideLayers('www_wuming_ren','','show','wuming_ren','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
数<br />码<br /><br /></li>
</ul>
</div>
<ul>
<li id="shone1" onmouseover="setOver('shone',1,1);MM_showHideLayers('www_wuming_ren','','show','wuming_ren','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
数<br />码<br /><br /></li>
</ul>
</td>
<td width="93%" valign="top">
<div id="apDiv3" onmouseover="setOver('shone',1,1);MM_showHideLayers('www_wuming_ren','','show','wuming_ren','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
<table width="674" border="0" cellspacing="0" cellpadding="3">
<tr>
<td width="651">sss新浪基金为全球用户24小时提供全面及时的基金中文资讯，内容涵盖基金行业动态、基金 净值、基金排名、基金数据、基金评级、基金知识、基金论坛、基金超市和基金联盟等</td>
</tr>
<tr>
<td>拥有丰富的新闻资讯及评论，详实的数据资料，专业的评级系统，活跃的基金经理沙龙， 火爆的wuming.ren论坛和博客，为您提供最优质的服务平台，是您贴心的理财参谋</td>
</tr>
<tr>
<td width="651">新浪基金为全球用户24小时提供全面及时的基金中文资讯，内容涵盖基金行业动态、基金 净值、基金排名、基金数据、基金评级、基金知识、基金论坛、基金超市和基金联盟等</td>
</tr>
<tr>
<td>拥有丰富的新闻资讯及评论，详实的数据资料，专业的评级系统，活跃的基金经理沙龙， 火爆的论坛和博客，为您提供最优质的服务平台，是您贴心的理财参谋</td>
</tr>
</table>
</div>
<div id="wuming_ren">
<table width="674" border="0" cellspacing="0" cellpadding="3" onmouseover="setOver('shone',1,1);MM_showHideLayers('www_wuming_ren','','show','wuming_ren','','hide','apDiv3','','show','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')" onmouseout="setOut('shone',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
<tr>
<td width="651">新浪基金为全球用户24小时提供全面及时的基金中文资讯，内容涵盖基金行业动态、基金 净值、基金排名、基金数据、基金评级、基金知识、基金论坛、基金超市和基金联盟等</td>
</tr>
<tr>
<td>拥有丰富的新闻资讯及评论，详实的数据资料，专业的评级系统，活跃的基金经理沙龙， 火爆的论坛和博客武鸣人网站，为您提供最优质的服务平台，是您贴心的理财参谋</td>
</tr>
</table>
</div>
</td>
</tr>
</table>  </td>
</tr>
<tr>
<td class="huixuxian">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="7%">
<div id="apDiv4">
<ul>
<li id="shtwo1" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
服<br />装<br /><br /></li>
</ul>
</div>
<ul>
<li id="shtwo1" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')"><br />
服<br />装<br /><br /></li>
</ul>
</td>
<td width="93%" valign="top">
<div id="apDiv6" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
<table width="674" border="0" cellspacing="0" cellpadding="3">
<tr>
<td width="651">太平洋女性网服饰频道提供海量时尚服饰资讯,服装新品上市一手资料,教你各类服装搭配的方案,打造属于你自己的魔鬼身材，完美身材</td>
</tr>
<tr>
<td>服装品牌,服装品牌排行榜,服装品牌大全,服装品牌排行榜__买服装先上品牌世家网. ... 戴菲菲为代言安踏女子时尚系列服装拍摄写真精美图</td>
</tr>
<tr>
<td width="651">太平洋女性网服饰频道提供海量时尚服饰资讯,服装新品上市一手资料,教你各类服装搭配的方案,打造属于你自己的魔鬼身材，完美身材</td>
</tr>
<tr>
<td>服装品牌,服装品牌排行榜,服装品牌大全,服装品牌排行榜__买服装先上品牌世家网. ... 戴菲菲为代言安踏女子时尚系列服装拍摄写真精美图</td>
</tr>
<tr>
<td width="651">太平洋女性网服饰频道提供海量时尚服饰资讯,服装新品上市一手资料,教你各类服装搭配的方案,打造属于你自己的魔鬼身材，完美身材</td>
</tr>
</table>
</div>
<div id="apDiv5">
<table width="674" border="0" cellspacing="0" cellpadding="3" onmouseover="setOver('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','show','apDiv5','','hide','apDiv6','','show')" onmouseout="setOut('shtwo',1,1);MM_showHideLayers('www_wuming_ren','','hide','wuming_ren','','show','apDiv3','','hide','apDiv4','','hide','apDiv5','','show','apDiv6','','hide')">
<tr>
<td width="651">太平洋女性网服饰频道提供海量时尚服饰资讯,服装新品上市一手资料,教你各类服装搭配的方案,打造属于你自己的魔鬼身材，完美身材</td>
</tr>
<tr>
<td>服装品牌,服装品牌排行榜,服装品牌大全,服装品牌排行榜__买服装先上品牌世家网. ... 戴菲菲为代言安踏女子时尚系列服装拍摄写真精美图</td>
</tr>
</table>
</div>    </td>
</tr>
</table>  </td>
</tr>
</table>
</body>
</html>


赞0
踩0
☆收藏0

本文来自武鸣人网站，转载请注明出处

本文地址：https://www.wuming.ren/a/1001.html

加亮
回帖

商城常用鼠标经过商品分类加亮显示特效 期待您的回复！

取消
载入表情清单……
载入颜色清单……
插入网络图片

取消确定

图片上传中
编辑器信息
提示信息