W3C 事件切换 颜色变化
颜色变化代码：
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="web6.css">
<script type="text/javascript" src="web6.js"></script>
<style type="text/css">
.red {
width:100px;
height:100px;
background: red;
}
.blue{
width:100px;
height:100px;
background: blue;
}
</style>
</head>
<body>
<div id="box" class="red">测试zhong</div>
</body>
</html>
JS
window.addEventListener('load',function(){
var box=document.getElementById('box');
box.addEventListener('click',toBlue,false);
},false);
function toRed() {
this.className='red';
this.removeEventListener('click',toRed,false);
this.addEventListener('click',toBlue,false);
}
function toBlue() {
this.className='blue';
this.removeEventListener('click',toBlue,false);
this.addEventListener('click',toRed,false);
}
效果：
16:04:28 2017-09-02
W3C 事件切换 颜色变化的更多相关文章
- 他们控制的定义--让背景颜色变化ViewPager逐步幻灯片
转载请注明出处.谢谢~ 今天想说一个简单但很好的效果达到.代码是绝对简单,达到绝对easy,就是你可能想不到而已. 不多说,上效果图. 第一个效果是仿最美应用的滑动颜色变化,第二个是我项目中要用的效果 ...
- iOS 滑动页面标题切换颜色渐变效果
话不多说,直接上图,要实现类似如下效果. 这个效果非常常见,这里着重讲讲核心功能 封装顶部的PageTitleView 封装构造函数 封装构造函数,让别人在创建对象时,就传入其实需要显示的内容 fra ...
- Visual Studio 2015 MFC之Button颜色变化-断点调试(Debug)
软件开发,对自己的程序进行调试很重要,本次文章在上一边随笔的基础上,介绍一下Button控件做显示灯的用法,Button控件的添加和变量设置等可以参考下面的的链接:Visaul Studio 2015 ...
- iOS开发--QQ音乐练习,歌词的展示,歌词的滚动,歌词的颜色变化
一.歌词的展示 -- 首先歌词是在scrollView上,scrollView的大小是两个屏幕的宽度 scrollView滚动修改透明度的代码 ...
- javascript 事件传播与事件冒泡，W3C事件模型
说实话笔者在才工作的时候就听说了什么"事件冒泡",弄了很久才弄个大概,当时理解意思是子级dom元素和父级dom元素都绑定了相同类型的事件,这时如果子级事件触发了父级也会触发,然后这 ...
- IE的事件与w3c事件的区别
14. offsetWidth, scrollLeft, scrollHeight? scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollHeig ...
- UI设计篇·入门篇·绘制简单自定义矩形图/设置按钮按下弹起颜色变化/设置图形旋转
Android的基本控件和图形有限,难以满足所有的实际需要和设计需求,好在Android给出了相对完善的图形绘制和自定义控件的API,利用这些API,可以基本满足设计的需求. 自定义图像和控件的方法: ...
- easyui之自定义字体图标（鼠标覆盖时切换颜色）
项目要求是自定义字体图标,使用easyui框架结构,众所周知easyui强功能弱样式,字体图标其实就是一张图片.要达到切换图标颜色的效果,要么就是有两套图,使用js控制.但是我这个人比较懒,不喜欢做复 ...
- vue点击切换颜色限制个数（用了mui框架）
vue点击切换颜色 只能点击一个 <!doctype html> <head> <meta charset="UTF-8"> <title ...
随机推荐
- Mybatis,模糊查询语句，以及传参数的正确写法
不多说直接上代码! 接口: public interface CommodityMapper { int deleteByPrimaryKey(Integer productId); int inse ...
- MacOS上zsh环境设置默认jdk
进入home目录 cd ~ 修改.zprofile文件 vi .zprofile 按i进入vim插入模式,添加以下代码 export JAVA_HOME="/Library/Java/Jav ...
- How to run a function when the page is loaded?
How to run a function when the page is loaded? window.onload = codeAddress; should work - here's a d ...
- Vue实现音乐播放器（七）：轮播图组件（二）
轮播图组件 <template> <div class="slider" ref="slider"> <div class=&qu ...
- 使用spring提供的@Scheduled注解创建定时任务
使用方法 操作非常简单,只要按如下几个步骤配置即可 1. 导入jar包或添加依赖,其实定时任务只需要spring-context即可,当然起服务还需要spring-web: 2. 编写定时任务类和方法 ...
- tensorflow 关于 矩阵 运算 + 符号得含义。 2维 数组 + 1纬数组， 就是每一行都 加一边 1纬数组。 呵呵
小锋子Shawn(403568338) 13:51:23mnist.training.images?墨须(964489899) 13:51:27我的图片是100*100的,该怎么兼容. 小锋子S ...
- nw打包vue项目 安装包
接着上篇nw打包vue项目exe中: copy /b nw.exe+dome.nw dome.exe 出现了dome.exe文件之后,要是打算打包成为安装包,网上推荐的是Inno Setup Comp ...
- 类HashSet
/* * Collection * * List * 有序(存储顺序和取出顺序一致),可以重复 * * Set * 无序(存储顺序和取出顺序不一致),唯一 * * */ import java.uti ...
- base64编解码的两个函数（安全版本）
void base64_encode_s(const unsigned char *str, long inlen, std::string& outstr, long* lpBufLen) ...
- Java ——String 类 StringBuffer 和 StringBuilder类 随机字符
本节重点思维导图 String 类 创建字符串 String str = "I love ai"; 在代码中遇到字符串常量时,"I love ai",编译器会使 ...