js鼠标切换显示DIV层中的CSS问题。 鼠标指到菜单div背景色透明会变,鼠标以后又变回原色。

js控制鼠标事件移动及移出效果显示
鼠标事件的移动及移出效果都可以使用js来自定义,下面有个示例,效果为当事件发生改变时背景颜色也随着改变,适合新手朋友
&style type="text/css"&
background-color:#FFFF00;
background-color:#00FFFF;
&table width="576" height="79" border="1"&
&td id="td1" onmousemove="document.getElementById('td1').className='style0';" onmouseout="document.getElementById('td1').className='style1'"&&div align="center" class="STYLE2"&主页&/div&&/td&
&td&&div align="center" class="STYLE2"&男&/div&&/td&
&td&&div align="center" class="STYLE2"&女&/div&&/td&
顶一下(0) 踩一下(0)
热门标签:div+css实现鼠标经过背景高亮的导航菜单代码
这篇文章主要为大家介绍了div+css实现鼠标经过背景高亮的导航菜单代码,涉及css样式设置的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了div+css实现鼠标经过背景高亮的导航菜单代码。分享给大家供大家参考。具体如下:
这是一款鼠标经过后切换背景的导航菜单,简单明了,给新手学习。已测试,兼容IE6、7、8、9,Firefox3、4、5、6,Chrome5以上,Opera,Safare,搜狗,遨游,360,TT ……
运行效果截图如下:
在线演示地址如下:
http://demo.jb51.net/js/2015/div-css-mouse-bg-show-nav-menu-codes/
具体代码如下:
&!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&&title&鼠标经过切换背景的导航菜单&/title&&meta http-equiv=”Content-Type” content=”text/ charset=gb; /&&style type=”text/css”&&!–body,td,th {font-size: 13}h1 {font-size:13 font-weight: margin:20}a:link,a:visited {color:#333333;text-decoration:}#nav {width:960margin-top:3text-align:background:url(images/bg_nav.gif) repeat-x;border:1px solid #CCC;}#nav ul{width:700margin:0height:25padding:0;text-align:background-color:#CCC;border-bottom:5px solid #FFF;}#nav li {padding:0;list-style:display:}#nav a {float:overflow:width:100height:25color:#333333;text-decoration:background:url(images/nav.gif) top left no-padding-top:5}#nav a:hover {background-position:0 -30}–&&/style&&/head&&body&&h1&办公一百分导航菜单,简单明了,给新手学习。&/h1&&p&已测试,兼容IE6、7、8、9,Firefox3、4、5、6,Chrome5以上,Opera,Safare,搜狗,遨游,360,TT ……&/p&&div id=”nav”&
&li&&a href=”#”&首 页&/a&&/li&
&li&&a href=”#”&业内新闻&/a&&/li&
&li&&a href=”#”&Word教程&/a&&/li&
&li&&a href=”#”&Excel教程&/a&&/li&
&li&&a href=”#”&PPT教程&/a&&/li&
&li&&a href=”#”&其它教程&/a&&/li&
&li&&a href=”#”&专题教程&/a&&/li&
&/ul&&/div&&/body&&/html&
希望本文所述对大家的div+css网页设计有所帮助。还没有任何记录...
鼠标移到文字上弹出提示层JS+CSS代码
来源:懒人建站作者:懒人建站懒人建站日期: 17:08
JS特效:鼠标移到文字上弹出提示层JS+CSS代码
鼠标移到文字上JS+CSS代码
本文链接:/js/texiao/42.html
鼠标移到文字上弹出提示层JS+CSS代码由懒人建站收集整理,您可以自由传播,请主动带上本文链接
就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。
鼠标移到文字上弹出提示层JS+CSS代码-相关文章
评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
网页特效-推荐
网页特效-人气榜
懒人建站为您提供-基于jquery特效,jquery弹出层效果,导航菜单代码,下拉菜单代码和jquery焦点图片代码,懒人建站关注软件界面设计,WEB/后台/手机/软件UI设计、建站素材、html5和CSS3新技术等。后使用快捷导航没有帐号?
只需一步,快速开始
查看: 26247|回复: 3
JS鼠标移动到链接上去时显示指定DIV,移出DIV时隐藏DIV怎么实现
UID567653在线时间 小时积分341帖子离线16928 天注册时间
中级会员, 积分 341, 距离下一级还需 159 积分
JS鼠标移动到链接上去时显示指定DIV,移出DIV时隐藏DIV怎么实现
网上看到这个效果,怎么才能实现,求助
UID531514在线时间 小时积分125帖子离线16928 天注册时间
初级会员, 积分 125, 距离下一级还需 75 积分
&!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&&
&meta http-equiv=&Content-Type& content=&text/ charset=utf-8& /&
&title&无标题文档&/title&
function MM_over(mmObj) {
var mSubObj = mmObj.getElementsByTagName(&div&)[0];
mSubObj.style.display = &block&;
mSubObj.style.backgroundColor = &#f60&;
function MM_out(mmObj) {
var mSubObj = mmObj.getElementsByTagName(&div&)[0];
mSubObj.style.display = &none&;
&div onmouseover=&MM_over(this)& onmouseout=&MM_out(this)& style=&width:100position:&&sdfsdf
&div style=&width:100height:100display:position:left:0;top:15z-inde:5;&&&p&&a href=&#&&ssss&/a&&/p&&p&&a href=&#&&ssss&/a&&/p&&/div&
&提示:您可以先修改部分代码再运行
UID567653在线时间 小时积分341帖子离线16928 天注册时间
中级会员, 积分 341, 距离下一级还需 159 积分
回复 2# weichengyu
真的太感谢了
越来越爱blueidea
UID560200在线时间 小时积分210帖子离线16928 天注册时间
中级会员, 积分 210, 距离下一级还需 290 积分
用li ul:hover{display:block}也能控制,但不支持IE6
Powered by怎么用JS写鼠标移上去变背景色,点击之后也是移上去变的这个色呢?急_百度知道
怎么用JS写鼠标移上去变背景色,点击之后也是移上去变的这个色呢?急
提问者采纳
&gray'&#47.backgroundColor=)&);onclick=& onmouseover=&change(')&change(&#39.getElementById('标签id&}&ltfunction changeColor(color){标签 id=&gray' &标签&标签id&#39.style
来自团队:
其他类似问题
为您推荐:
背景色的相关知识
其他2条回答
mouseover()与mouseaway()。
请你说的详细点好吗?
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁}

我要回帖

更多关于 div背景色透明 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信