js导航栏单击事件背景颜色变换

 1 <head>
 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 3 <title>无标题文档</title>
 4 <script type="text/javascript">
 5 function change_bg(obj)
 6 {
 7     var a=document.getElementById("Menu").getElementsByTagName("a");
 8     for(var i=0;i<a.length;i++)
 9     {
10         a[i].className="";
11     }
12     obj.className="current";
13 }
14 </script>
15 <style type="text/css">
16 body{
17     font-size:17px;
18 }
19 .current{
20     background:red;
21 }
22 #container ul
23 {
24     list-style-type:none;
25 }
26 #container ul li
27 {
28     float:left;
29     margin-right:3px;
30 }
31 #container ul li a{
32 text-decoration:none;
33 color:#000;
34
35 }
36 </style>
37 </head>
38 <body>
39 <div id="container">
40 <ul id="Menu">
41 <li><a href="javascript:" onclick="change_bg(this)" class="current">Menu1</a></li>
42 <li><a href="javascript:" onclick="change_bg(this)">Menu2</a></li>
43 <li><a href="javascript:" onclick="change_bg(this)">Menu3</a></li>
44 <li><a href="javascript:" onclick="change_bg(this)">Menu4</a></li>
45 <li><a href="javascript:" onclick="change_bg(this)">Menu5</a></li>
46 </ul>
47 </div>
48 </body>
49 </html>
时间: 2024-10-16 19:09:19

js导航栏单击事件背景颜色变换的相关文章

0-导航栏单击事件背景变换

<!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>导航条</title> <script type="text/javascript"> function change_bg(obj){ /* 获取-导航条>

Android实现连续并排的若干个TextView单击改变背景颜色达到选项卡Tab栏切换效果

<Android实现连续并排的若干个TextView单击改变背景颜色达到选项卡Tab栏切换效果> 实现的组件交互目的很简单,就是要达到类似tab选项卡的导航栏一样,当用户点击了连续并排的若干个TextView其中之一时候,要产生一定的交互效果(背景颜色改变等).这种实现的方式有不少可选方案,现在通过背景的selector.xml实现. 效果如下: A.初始状态: B.当用户单击了TextView 2,但此时用户的手指一直在按下并未松开的状态,(注意交互设计效果!TextView 2的背景颜色变

【转】iOS中设置导航栏标题的字体颜色和大小

原文网址:http://www.360doc.com/content/15/0417/11/20919452_463847404.shtml iOS中设置导航栏标题的字体颜色和大小,有需要的朋友可以参考下. 在平时开发项目的时候,难免会遇到修改导航栏字体大小和颜色的需求,一般使用自定义视图的方法,其实还存在一种方法. 方法一:(自定义视图的方法,一般人也会采用这样的方式) 就是在导航向上添加一个titleView,可以使用一个label,再设置label的背景颜色透明,字体什么的设置就很简单了.

iOS中设置导航栏标题的字体颜色和大小

在平时开发项目的时候,难免会遇到修改导航栏字体大小和颜色的需求,一般使用自定义视图的方法,其实还存在一种方法. 方法一:(自定义视图的方法,一般人也会采用这样的方式) 就是在导航向上添加一个titleView,可以使用一个label,再设置label的背景颜色透明,字体什么的设置就很简单了. //自定义标题视图 UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 200, 44)]; titleLabel.b

iOS 设置导航栏的颜色和导航栏上文字的颜色

#import <UIKit/UIKit.h> @interface AppDelegate : UIResponder <UIApplicationDelegate> @property (strong, nonatomic) UIWindow *window; @end #import "AppDelegate.h" #import "KeyViewController.h" @interface AppDelegate () @end

iOS-修改导航栏文字字体和颜色

//修改导航栏文字字体和颜色 nav.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName:[RGBColor colorWithHexString:@"#4b95f2"],NSFontAttributeName:[UIFont boldSystemFontOfSize:20]}; //修改导航栏颜色 [[UINavigationBar appearance]setBarTintColor:[RGBCo

【2017-4-2】JS导航栏 选项卡

一.导航栏 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style type="text/css&

iOS项目开发实战——自定义设置导航栏和状态栏背景

在iPhone的状态栏顶部,会有很多的信息,如运营商,信号强弱,网络状况,时间,电量等等.我们使用很多的App,如微信,QQ等等,都会发现导航栏的背景或者说图片都是重新设置过的,这样就能增加用户体验,也能更加节省下方的屏幕空间.那如何来设置导航栏的图片呢? (1)首先建立一个iOS项目,语言选择Swift.并且在Images.xcassets中拖入一张图片,大小要自己设置好,用来作为顶部导航栏的背景. (2)在Main.storyboard中选中ViewController,然后选择Editor

JS点击更换网页背景颜色

JS部分 <script type="text/javascript"> // 定义可换的颜色 var colors = ["#ff0000", "#00ff00", "#0000ff", "#ffff00", "#00ffff", "#ff00ff"]; var index = 0; // 换色方法 function changeColor() { //