问答文章1 问答文章501 问答文章1001 问答文章1501 问答文章2001 问答文章2501 问答文章3001 问答文章3501 问答文章4001 问答文章4501 问答文章5001 问答文章5501 问答文章6001 问答文章6501 问答文章7001 问答文章7501 问答文章8001 问答文章8501 问答文章9001 问答文章9501
你好,欢迎来到懂视!登录注册
当前位置: 首页 - 正文

使用JavaScript代码给每个li列表加两个鼠标事件onmouseover和onmouseout

发布网友 发布时间:2022-04-23 19:06

我来回答

2个回答

热心网友 时间:2022-04-23 20:36

<!DOCTYPE html>
<html>
  <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>RunJS 演示代码</title>
<style>
.kuai_two{
display:none;
}
</style>
<script>
onload=function(){
var lis = document.getElementsByTagName("li");
for(var i=0;i<lis.length;i++){
var li = lis[i];
var div=li.children[1];
li.onmouseenter = function(){
div.style.display='block';
}
li.onmouseleave=function(){
div.style.display='none';
}
}

</script>
  </head>
<body>
    <ul>
<li> dfgdgdfg
<dl>
<dd><a>sdf</a></dd>
<dd><a>sdf</a></dd>
<dd><a>sdf</a></dd>
<dd><a>sdf</a></dd>
<dd><a>sdf</a></dd>
</dl>
<div class="kuai_two">
<p>
aaaaaa
</p>
<br /><br />
<p>
bbbbbb
</p>
<br /><br />
<h5>
site
</h5>
<p>
11111
</p>
<p>
22222
</p>
<p>
333
</p>
<p>
66666
</p>
<p>
55555
</p>
</div>
</li>
</ul>
  </body>
</html>

热心网友 时间:2022-04-23 21:54

这个css就能实现吧?
li div{
display:none;
}
li:hover div{
display:block;
}
使用JavaScript代码给每个li列表加两个鼠标事件onmouseover和onmouseo...

var div=li.children[1];li.onmouseenter = function(){div.style.display='block';}li.onmouseleave=function(){div.style.display='none';}}} &lt;/script&gt; &lt;/head&gt;&lt;body&gt; &lt;ul&gt;&lt;li&gt; dfgdgdfg&lt;dl&gt;&lt;dd&gt;&lt;a&gt;sdf&lt;/a&gt;&lt;/dd&gt;&lt;dd&gt;&lt;a&gt;sdf&lt;/a&gt;&lt;/dd&gt;&lt;dd&gt;&lt;a&gt;sdf&lt;/a&gt;&lt;/dd&gt;&lt;dd&gt;&lt;...

关于js的鼠标移入移出事件

在JavaScript中,处理鼠标移入和移出事件主要使用onmouseenter、onmouseover、onmouseleave和onmouseout属性。具体代码如下:为id为"selectModal"的元素绑定鼠标移入事件:document.getElementById("selectModal").onmouseenter = function() { console.log('鼠标移入')} 绑定鼠标移出事件:document.getElementB...

JavaScript OnMouseOut事件

onmouseover和onmouseout鼠标移入移出时触发的事件:onmouseover 用户鼠标移入元素时触发的事件。并执行onmouseover调用的函数。onmouseout 用户鼠标移开元素时触发的事件。并执行onmouseout调用的函数。onmouseover和onmouseout 这两个事件在javascript中较常用。下面通过一个示例更深入了解这两个事件的使用:示例:鼠标...

JavaScript 怎么一次创建两个事件,比如鼠标悬停改变背景颜色和字体颜色...

代码说明:这里面确实一次为这个段落创建了两个事件,都是DOM通用的事件,一个叫mouseover(鼠标悬停),一个叫mouseout(鼠标离开),mouseover事件触发时要用到2个函数(function), 分别是chfgcolor和chbgcolor, 而mouseout只用到1个chback函数。还有,事件触发时会运行一些东西,但是不一定是函数。

求一段代码,鼠标触发事件,onmouseover和onmouseout,触发一个div显示和...

&lt;script&gt; (document).ready(function{ ("#div1").mouseover(function{ ("#div2").hide();});("#div1").mouseout(function{ ("#div2").show();});});&lt;/script&gt; &lt;div id="div1" style="width:50px;height:20px;float:left;"&gt;div1&lt;/div&gt; &lt;div id="div2" style="width:50px...

javascript 给标签累加事件的方法

那你吧原来的事件写在函数里比如var f1=function(){};然后你再设置里调用一次这个函数 document.getElementById("tr1").onmouseover=function(){ f1();...执行语句 }

网页制作问题:请问加什么代码可以让鼠标移到单元格,单元格里的字颜色...

在单元格里加onmouseover事件和onmouseout事件。如:&lt;td onmouseover="javascript:this.style.color='#ff0000';" onmouseout="javascript:this.style.color='原来颜色';"&gt;移入字改变成红色&lt;/td&gt; It will be OK!

onmouseover和onmouseout控制鼠标移动到div1上显示div2,移出div1时d...

.style.visibility="hidden";} function show(element){ document.getElementById(element).style.visibility="visible";} &lt;/script&gt; &lt;div id="div1" onmouseover="show('div2')" onmouseover="hide('div2')"&gt;div1&lt;/div&gt; &lt;div id="div2" style="visibiliry:hidden;"&gt;div2&lt;/div&gt; ...

如何设置当鼠标移动到一个div上时,下面显示两个div

这是需要javascript完成的 &lt;div id="one" onmouseover="show('item')" onmouseout="hide('item')"&gt;调和转罐&lt;/div&gt;&lt;ul id="item"&gt; &lt;li&gt;一转多&lt;/li&gt; &lt;li&gt;多转一&lt;/li&gt;&lt;/ul&gt;&lt;style&gt;#item{display:none}&lt;/style&gt;&lt;script type="text/javascript"&gt;function show(obj){ var XS = ...

onmouseover和o的用法?

当鼠标在网页元素上移动时,JavaScript提供了两个常用的事件处理函数:onmouseover和onmouseout。onmouseover用于定义鼠标滑上元素时触发的事件,而onmouseout则在鼠标离开元素时生效。例如,如果你想让鼠标滑上时暂停一个元素的滚动,可以这样设置:鼠标滑上暂停滚动 这里,当鼠标滑上按钮时,滚动行为会被设置为'...

声明:本网页内容为用户发布,旨在传播知识,不代表本网认同其观点,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。
E-MAIL:11247931@qq.com
HP4411S 笔记本触摸屏无反应 dnf赛丽亚的物品合成怎么用 劳力士蓝游艇适合搭配什么风格的表带? 我想在一电脑上同时开两个或者多个用户名怎么做,,求助高手~~! 女孩子自考什么专业好 女生自考什么专业含金量高 清华自强计划招生通过了是不是就可以被录取? 清华自强计划好通过吗? 清华大学自强计划过了笔试有分加吗? 20以内的质数加上1还是质数的数有()。 自信的孩子往往成绩更好,那该怎样让孩子更自信呢? 脾胃虚寒患者能吃白萝卜吗 帮我看下,怀孕9周多,胎儿发育正常吗 怀孕9周胎儿太小,这是为什么呀?有知道的妈妈帮我回答一下? 怎样就可以让不自信的孩子越来越自信? 怀孕九个月,孩子有多大才算正常 请问怀孕9周加2天,正常的话小孩该有多大了… 脾虚胃寒可以吃萝卜么 脾虚的人能吃熟萝卜吗 为什么白萝卜不适合脾胃虚弱者 脾胃虚弱的人能吃萝卜吗 九周孕囊大小多大正常 脾胃虚寒的人可以吃萝卜吗? 怎样让孩子变得更自信呢,正确的教育方式是什么? 脾虚能吃白萝卜吗 拿笔的正确手势! 七彩虹r7 360和精影gtx760哪个好呢 百度地图的定位图标在哪,我这怎么没有? AMDr7360和AMDhd7800系列差距大概多大差距大概 AMD R7360 和7700性能相比如何,前者Win7系统评分7.7后者7.5 脾虚能不能生吃青萝卜(水果萝卜)? 吃补中益气丸好还是补脾益肠丸好? 怎样就可以让不自信的孩子越来越自信?你会怎么做? 白萝卜有滋补作用吗?我是肝肾阴虚和心脾虚,能不能吃白萝卜? 富士变频器调试出现炸机,接线只接入RST,控制与输出均处断开状态,仅5秒后便炸机了 电梯富士LIFT变频器不用承重时如何调试启动舒适感 富士电机MEGA系列变频器调试监控软件FRENIC-MEGA PC Loader中文版下载 怎样做出的肉丸子才好吃?有什么小窍门? 怎么做肉丸才做的好吃 怎样区分氯酸钾、硝酸钾? 氯气通入硝酸钾溶液中产生白色沉淀,其反应离子方程式 怎样鉴别氯酸钾和硝酸钾? 怎么鉴别硝酸钾和氯酸钾溶液? 高氯酸钾,氯酸钾,*钾的氧化性哪个强.形成的爆炸性混合物哪个更强 硝酸钾,氯酸钾,高氯酸钾, 氯酸钾与硝酸钾为什么不能同可燃物混放 氯酸钾和硝酸钾哪个氧化性强?为什么 氯酸钾的氧化性为什么要比硝酸钾强? 如何去除硝酸钾中的氯化钾 “嫩绿 苍绿 碧绿 墨绿”怎么排序? 六年级填空题,急!
  • 焦点

最新推荐

猜你喜欢

热门推荐