JS JQ 帮我改改这实现鼠标移到新增CSS样式
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS JQ 帮我改改这实现鼠标移到新增CSS样式相关的知识，希望对你有一定的参考价值。
当鼠标移动到 <dl class="nav-item"></dl>
下列新增样式
<dl class="nav-item"></dl> 新增样式 active
<div class="sub-nav-show">新增样式 sub-nav-active
<div class="nav-show"></div> 新增样式 active
鼠标移开删除新增样式
jQuery(".nav-item").mouseenter(function()
jQuery(this).addClass('active').siblings().removeClass('active');
jQuery('.sub-nav-show').addClass('sub-nav-active').siblings().removeClass('sub-nav-active');
jQuery('.nav-show').addClass('active').siblings().removeClass('active');
);
我自己琢磨的只能实现 <dl class="nav-item"></dl> 新增样式 active
还有下面2个没实现
<div class="sub-nav-show">新增样式 sub-nav-active
<div class="nav-show"></div> 新增样式 active
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script class="jquery library" src="/js/sandbox/jquery/jquery-1.8.2.min.js" type="text/javascript"></script>
<title>RunJS 演示代码</title>
<style>
.active
color:pink;
.sub-nav-active
color:red;
.pp
color:green;
</style>
<script>
$(function()
$(".nav-item").hover(function()
$(this).toggleClass("active")
.siblings(".nav-item.active")
.end()
.next('.sub-nav-show').toggleClass('sub-nav-active')
.next(".nav-show").toggleClass("active");
);
);
</script>
</head>
<body>
<ul>
<li>
<dl class="nav-item">新增样式 active</dl>
<div class="sub-nav-show">新增样式 sub-nav-active</div>
<div class="nav-show">新增样式 active</div>
<dl class="nav-item">新增样式 active</dl>
<div class="sub-nav-show">新增样式 sub-nav-active</div>
<div class="nav-show">新增样式 active</div>
<dl class="nav-item">新增样式 active</dl>
<div class="sub-nav-show">新增样式 sub-nav-active</div>
<div class="nav-show">新增样式 active</div>
</li>
</ul>
</body>
</html>追问
同样 <dl class="nav-item"></dl> 新增样式 active了
这两个还是没有变化
<div class="sub-nav-show">新增样式 sub-nav-active
<div class="nav-show"></div> 新增样式 active
javascript 改变鼠标样式
鼠标移到表格某个格时，鼠标的样子变成系统那个手形的样子，移开时变回来
求js代码
<td style="cursor:hand">...</td>
如果必须用js实现的话，可以给单元格添加mouseover和mouseout事件，然后使用
cellid.style.cursor = "hand"; 设置为手型
和
cellid.style.cursor = "default"; 恢复默认
cellid是单元格的id 参考技术A <table border=1 width=100%><td id='m'>鼠标移到上面变成手形<td>鼠标移到上面变回来<table>
<script>
m.onmouseover = function()
this.style.cursor = 'hand';
</script>
以上是关于JS JQ 帮我改改这实现鼠标移到新增CSS样式的主要内容，如果未能解决你的问题，请参考以下文章