css鼠标点击项背景图片更改???

请教高手如何实现:css鼠标点击项背景图片更改???点哪个选,哪个项的图片背景就是左边白色图片背景。我知道是需要一段JS控制代码,请问JS代码怎么写?我其余代码写出来了,... 请教高手如何实现:css鼠标点击项背景图片更改???点哪个选,哪个项的图片背景就是左边白色图片背景。我知道是需要一段JS控制代码,请问JS代码怎么写?

我其余代码写出来了,如下:
<style type="text/css">
<!--
#nav {
PADDING-BOTTOM: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; BACKGROUND: url(menu_bg.gif); HEIGHT: 39px; PADDING-TOP: 0px
}
#nav UL {
PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px
}
#nav UL LI {
TEXT-ALIGN: center; WIDTH: 106px; FLOAT: left; HEIGHT: 25px; FONT-WEIGHT: bold; PADDING-TOP: 14px
}
#nav UL LI.cum {
TEXT-ALIGN: center; WIDTH: 106px; BACKGROUND: url(menu_over_bg.gif) no-repeat 50% 0px; FLOAT: left; HEIGHT: 25px; COLOR: #3c0067; FONT-WEIGHT: bold; PADDING-TOP: 14px
}
#nav UL LI.cum A:link {
COLOR: #cd0000; TEXT-DECORATION: none
}
#nav UL LI.cum A:visited {
COLOR: #cd0000; TEXT-DECORATION: none
}
#nav UL LI.cum A:hover {
COLOR: #333333; TEXT-DECORATION: none
}
-->
</style>
</head>

<body>

<DIV id=nav class=main_w>
<UL>
<LI onclick="this.className='click';"><A href="index.html">代理加盟</A> </LI>
<LI><A href="index2.html">会员中心</A> </LI>
</UL>
</DIV>
展开
 我来答
锋火郎言
推荐于2016-12-03 · 知道合伙人互联网行家
锋火郎言
知道合伙人互联网行家
采纳数:469 获赞数:1454

向TA提问 私信TA
展开全部
<script language="javascript">
function ss(id){
return document.getElementById(id);
}

function menu_my(name,num) {
var my;
my = ss(name);

if ( my.last == undefined ) {
my.last = 1;
}
var Menu = ss("menu" + name + my.last);
var Cont = ss("cont" + name + my.last);
Menu.className = "";
Cont.style.display = "none";

var Menu = ss("menu" + name + num);
var Cont = ss("cont" + name + num);
Menu.className = "s_current";
Cont.style.display = "block";
my.last =num ;

}
</script>

<div id="s_topnav">
<ul id="a">
<li class="s_current" id="menua1" onclick="menu_my('a',1)">最新上传</li>
<li id="menua2" onclick="menu_my('a',2)">最多点击</li>
<li id="menua3" onclick="menu_my('a',3)">专家推荐</li>
</ul>
</div>
<div class="s_content" id="conta1">111111<div>

<div class="s_content" id="conta2" style="display:none;">111111<div>

上边是JS下边展示形式。自己摘吧。
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
数都信息
2024-09-29 广告
上海数都信息科技有限公司是一家科技型的设计公司,团队深耕企业品牌设计服务已有十余年,已助力多家企业塑造其品牌形象及体验,服务内容含:LOGO设计/VI设计/产品包装设计/导视店面门头及空间设计,吉祥物设计/海报设计等。 我们的目标是帮助小微... 点击进入详情页
本回答由数都信息提供
Genius2009
2010-05-12 · TA获得超过346个赞
知道答主
回答量:120
采纳率:0%
帮助的人:0
展开全部
<!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=utf-8" />
<title>无标题文档</title>
<style type="text/css">
<!--
#nav {
PADDING-BOTTOM: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
HEIGHT: 39px;
PADDING-TOP: 0px;
background-color:#C00;
}
#nav UL {
PADDING-BOTTOM: 0px;
LIST-STYLE-TYPE: none;
MARGIN: 0px;
PADDING-LEFT: 0px;
PADDING-RIGHT: 0px;
PADDING-TOP: 0px;
}
#nav UL LI {
TEXT-ALIGN: center;
WIDTH: 106px;
FLOAT: left;
HEIGHT: 25px;
FONT-WEIGHT: bold;
PADDING-TOP: 14px
}
#nav UL LI.cum {
TEXT-ALIGN: center;
WIDTH: 106px;
background-color:#FFF;
border:1px solid #900;
FLOAT: left;
HEIGHT: 25px;
COLOR: #3c0067;
FONT-WEIGHT: bold;
PADDING-TOP: 14px
}
#nav UL LI.cum A:link {
COLOR: #cd0000;
TEXT-DECORATION: none
}
#nav UL LI.cum A:visited {
COLOR: #cd0000;
TEXT-DECORATION: none
}
#nav UL LI.cum A:hover {
COLOR: #333333;
TEXT-DECORATION: none
}
-->
</style>
<script language="javascript" type="text/javascript">
<!--
function changeMc(x,y){
// x是当前显示的层 y是即将显示的层
document.getElementById(x).style.display = "none"
document.getElementById(y).style.display = "block"
}
-->
</script>
</head>

<body>
<DIV id=nav class=main_w>
<UL id="dataBox1" style="display:block;">
<LI onclick="javascript:changeMc('dataBox1','dataBox2')" ><A href="#" >代理加盟</A> </LI>
<LI onclick="javascript:changeMc('dataBox2','dataBox1')" class="cum"><A href="#" >会员中心</A> </LI>
</UL>
<UL id="dataBox2" style="display:none;" >
<LI onclick="javascript:changeMc('dataBox1','dataBox2')" class="cum"><A href="#" >代理加盟</A> </LI>
<LI onclick="javascript:changeMc('dataBox2','dataBox1')" ><A href="#" >会员中心</A> </LI>
</UL>
</DIV>
</body>
</html>

不知道你是不是要做选项卡,我一般都是这样做选项卡的,这样写可以减少JS的代码,相反HTML代码会较多点!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
lLlingZz
2010-05-21
知道答主
回答量:4
采纳率:0%
帮助的人:0
展开全部
你如果只是实现这个效果的话,就没必要写js,那样会加载网站的运营的速度的,可以直接通过Css来改变其效果!也就相当于hover的效果,通过onclick换掉其css样式即可!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友3f9531f
2010-05-14 · TA获得超过509个赞
知道小有建树答主
回答量:433
采纳率:0%
帮助的人:261万
展开全部
onclick="this.style.background=url('路径')"
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式