导航:首页 > 编程语言 > js鼠标移开隐藏选项卡

js鼠标移开隐藏选项卡

发布时间:2023-06-06 23:41:17

㈠ 在js中怎么做到一列菜单,当鼠标移上去的时候会显示子菜单,离开时隐藏子菜单

鼠标移动上去用【onmouseover】,此时子菜单使用【display=“block”】属性显示;鼠标离开用【onmouseout】,此时子菜单使用【display=“none”】隐藏;

㈡ js鼠标移动至图片上,出现文字鼠标移开文字隐藏代码

直接利用css就能办到鼠标移上去显示 离开隐藏的效果:
<style>
#aa{position:relative;width:300px; height:200px;}
#aa img{display:block;width:100%;height:100%;}
#aa span{display:none;}
#aa:hover span{position:absolute;left:0;bottom:0;display:block;width:100%;height:30px; line-height:30px;text-align:center; color:#eee;}
</style>

JS写法:
<script>
window.onload = function(){
var box = document.getElementById('aa');
box.onmouseover = function(){
this.getElementsByTagName('span')[0].style.display = 'block';
}
box.onmouseout = function(){
this.getElementsByTagName('span')[0].style.display = 'none';
}
}
</script>

<div id="aa">
<img src="http://pic31.nipic.com/20130725/5252423_162905249000_2.jpg" />
<span>文字内容</span>
</div>

㈢ 用js做下拉导航条 当鼠标指上去显示 鼠标移开就隐藏 怎么做 求代码

首先结构如下:

<style>.nav>li {width:120px;height:40px;display:inline-block;padding:5px 15px;background:#ddd;text-align:center}.nav li ul {display:none}.subnav li {padding:5px}.nav li:hover .subnav {display:block;background: #e8e8e8}
</style>
<ul class="nav">
<li><a href="">一级菜专单属1</a>
<ul class="subnav">
<li><a href="">2级菜单</a></li>
<li><a href="">2级菜单</a></li>
</ul>
</li>
<li><a href="">一级菜单2</a>
<li><a href="">一级菜单3</a>
</ul>

㈣ jQuery如何实现鼠标移入移出显示与隐藏二级菜单啊

<divclass="parent">
<li>a区域</li>
<divclass="bb">bbbbb区域</div>
</div>
<style>
.bb{display:none;}
</style>
<script>
//引入jquery.js后
$(function(){
$(".parent").hover(
function(){
$(".bb").show();
},
functin(){
$(".bb").hide();
}
);

})
</script>

㈤ js div鼠标滑动显示隐藏

一个div的鼠标滑过隐藏后,就再也滑不上了。因为页面已经看不见它了。内

所以应该鼠标滑过一个容div,让另一个div显示和隐藏,下面是简单代码,仅供参考:

<style>
div{width:100px;height:100px;background:#ccc;margin:10px;}
</style>
<body>
<divid='div1'></div>
<divid='div2'></div>
</body>
<script>
varoDiv1=document.getElementById('div1');
varoDiv2=document.getElementById('div2');
oDiv1.onmouseover=function(){
oDiv2.style.display='none';
};
oDiv1.onmouseout=function(){
oDiv2.style.display='block';
};
</script>

㈥ JavaScript代码求救,想做鼠标移入显示图片,移出隐藏

<imgsrc=""onmousemove="this.src='https://ss0..com/6ONWsjip0QIZ8tyhnq/it/u=3146244483,1982398836&fm=58'"onmouseout="this.src=''"width="80"height="80">

㈦ 用JS做鼠标滑动显示DIV、鼠标滑开隐藏DIV banner_son和banner_son2设置为隐藏了 JS代码怎么写

JQuery的写法,可以帮你写一个,试试吧:
//首先要确定你的banner_son和banner_son2都是隐藏的,并且回隐藏的写法为答display:none;属性。
$(function(){
$("#menu1").mouseenter(function(){
$("#banner_son").show();

}).mouseleave(function(){
$("#banner_son").hide();

});
$("#menu2").mouseenter(function(){
$("#banner_son2").show();
}).mouseleave(function(){
$("#banner_son2").hide();
})})

阅读全文

与js鼠标移开隐藏选项卡相关的资料

热点内容
文件查看设置信息失败 浏览:668
编程如何编出乌鸦喝水的课文 浏览:20
国家反诈app报案助手怎么使用 浏览:439
秘密文件丢失多少天 浏览:237
js中csstext 浏览:382
目标文件名过长复制 浏览:892
乐动力计步器老版本 浏览:933
压缩文件链接怎么编辑 浏览:808
如何锁定PDF文件里的图章 浏览:89
数据库超时是什么 浏览:649
文件怎么改整列内容 浏览:764
360压缩文件发邮件空白 浏览:813
上哪里查自己大数据 浏览:907
编程语言怎么学车 浏览:189
编程该怎么学才能先找工作 浏览:524
文件刻制光盘多少钱 浏览:861
校园网的网络组成结构 浏览:862
u盘系统复制文件过大 浏览:843
局域网复制文件 浏览:574
2007cad怎么编程 浏览:325

友情链接