您现在的位置是:首页 > 网站建设网站建设

js中前后内容比较实现高亮怎么做的啊

江湖快报网2023-01-14 12:44:00【网站建设】人已围观

简介给相应的每个元素加个事件,比如onmouseover事件,

调用一个函数,让相同的两个部分显示相同的背景颜色就可以了。
当前链接高亮代码首页也一起亮,代码那有出错,求大神解决。。

给相应的每个元素加个事件,比如onmouseover事件,

调用一个函数,让相同的两个部分显示相同的背景颜色就可以了。

当前链接高亮代码首页也一起亮,代码那有出错,求大神解决。。

你这个是PHPCMS的当前栏目高亮,cms可以这么写:给循环的li加判断 不用js都可以。
<div class=nav>
<ul class=menu id=menu>
<li {if !$catid} class='cur' {/if}><a href={siteurl($siteid)} >首页</a></li>
{loop $data $v}
<li {if $catid=$r['catid]} class='cur' {/if}><a href={$v[url]}>{$v[catname]}</a></li>
{/loop}
</ul>
</div>

js怎样跳页面后导航二级菜单还是是高亮状态

实现这个效果需要CSS的配合,关键是用JS为当前点击对象添加高亮的样式,并移除其他对象的高亮样式。举例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<!DOCTYPE html>
<html lang=en>
<head>
<meta charset=UTF-8>
<title>Document</title>
<style>
#nav li {float: left; width: 80px; text-align: center; list-style-type: none;}
.nav-active {background: #369;}
.nav-active a {color: #fff;}
</style>
</head>
<body>
<ul id=nav>
<li class=nav-active><a href=javascript:;>首页</a></li>
<li><a href=javascript:;>导航一</a></li>
<li><a href=javascript:;>导航二</a></li>
<li><a href=javascript:;>导航三</a></li>
<li><a href=javascript:;>导航四</a></li>
</ul>
<script src=

<script>
$('#nav').find('li').click(function() {
// 为当前点击的导航加上高亮,其余的移除高亮
$(this).addClass('nav-active').siblings('li').removeClass('nav-active');
});
</script>
</body>
</html>

Tags:高亮   二级   菜单

很赞哦! ()

文章评论

    共有条评论来说两句吧...

    用户名:

    验证码:

本站推荐