js选中变色,不选中鼠标放上变色
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{
margin:0px auto;
padding:0px;
}
#da{
width:100%;
height:280px;
}
.xiao{
width:100px;
height:20px;
background-color:#00F;
border:1px solid #FFF;
text-align:center;
line-height:20px;
vertical-align:middle;
color:#FFF;
}
.xiao:hover{
cursor:pointer;
}
</style>
</head> <body>
<div id="da">
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张海军</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张琦伟</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张胜国</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">继文楷</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张三</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">李四</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">王五</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">猎人但</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">狗剩</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">王八蛋</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">狗屎</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">滚蛋</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">哈喽</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">凯奇</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张海军</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张琦伟</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张胜国</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">继文楷</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">张三</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">李四</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">王五</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">猎人但</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">狗剩</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">王八蛋</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">狗屎</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">滚蛋</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">哈喽</div>
<div class="xiao" onclick="Dian(this)" onmousemove="Fang(this)">凯奇</div>
</div>
</body>
<script type="text/javascript">
function Dian(a)
{
var xiao=document.getElementsByClassName("xiao")
for(var i=0; i<xiao.length;i++)
{
xiao[i].removeAttribute("bs")
xiao[i].style.backgroundColor="#00F"
}
a.setAttribute("bs",1);
a.style.backgroundColor="red";
}
function Fang(b)
{
var xiao=document.getElementsByClassName("xiao")
for(var i=0; i<xiao.length;i++)
{
if(xiao[i].getAttribute("bs")!="1")
{
xiao[i].style.backgroundColor="#00F"
}
}
b.style.backgroundColor="red";
}
</script>

js选中变色,不选中鼠标放上变色的更多相关文章
- 抽屉head部分,hover应用,鼠标放上变色
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- css 鼠标移动到按钮图片改变;图片换层;鼠标放上透明度改变直到隐藏;
css 鼠标移动到按钮图片改变: 方法一: <style> .pp a { width:575px; height:157px; background:url(1.jpg);/*图片地址* ...
- 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth
变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...
- 鼠标放上时显示隐藏的div或者其他代码的“jquery”的三种写法和“JavaScript”的一种写法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 动态创建div(鼠标放上显示二维码)
最近的微信大行其道.各个网站上都给出的微信验证码,进行手机扫描加入. 怎么创建类似与点击鼠标弹出一个浮动的div显示二维码的这种效果. 1.首先制作好这样的图片,写css样式 <style ty ...
- td里的内容宽度自适应 及 鼠标放上显示标题div title
td里的内容自适应宽度, 用 width:100%控制 strRight+="<td bordercolor='#DEDEDE' width='500px' height='50px' ...
- easyui 单元格超出鼠标放上弹出全部
其他方式:https://www.cnblogs.com/raitorei/p/9878192.html onLoadSuccess : function(data) { //单元格超出部分隐藏并鼠标 ...
- jq div鼠标放上、离开马上展开、收缩方法
<body> <div id="aa" style="width:500px; height:30px; border:1px solid #000&q ...
- 用CSS做长度超过长度显示‘...’,当鼠标放上时显示全部内容
<!DOCTYPE html> <html> <head> <meta name="author" content="Yeeku ...
随机推荐
- 横向滑动的listview和其中用到的触摸监听事件详解
一.首先把横向的listview的代码放上来 HorizontalListView: package com.common.cklibrary.utils.myview; import java.ut ...
- SpringCloud教程 | 第二篇: 服务消费者(rest+ribbon)
在上一篇文章,讲了服务的注册和发现.在微服务架构中,业务都会被拆分成一个独立的服务,服务与服务的通讯是基于http restful的.Spring cloud有两种服务调用方式,一种是ribbon+r ...
- React(二)组件
1.组件概念: 我理解的组件的概念就是复用性,一个组件开发完成后可以重复使用. 2.简单的组件编写 (1)在src中创建一个components的文件夹,里面创建一个header.js的文件 (2)在 ...
- ES6 promise学习
Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件——更合理和更强大. 1.promise是一构造函数,既然是构造函数,那么我们就可以用 new Promise()得到一个p ...
- Educational Codeforces Round 6
620A - Professor GukiZ's Robot 20171122 \(ans=max(\left | x2-x1 \right |,\left | y2-y1 \right |)\ ...
- checkPathValidity 检查所有agent的corridor的m_path是否有效
在checkPathValidity(检查所有agent的corridor的m_path是否有效) 如果是无效的要进行重新设置并且设置replan 首先获得第一个polygon,m_path[0] 这 ...
- js 第三期 小肩膀 第一段
var 时间戳 = new.Date().getTime();//系统引擎 var 时间戳 = Date.now(); //V8引擎 数据类型 false = underfuned =null = ...
- 【C++】链表回环检测
//链表回环检测问题 #include<iostream> #include<cstdlib> using namespace std; ; struct node { int ...
- 理解npm run
引言 ReactNative 开发中经常用到一些npm run的命令来打包.最近在这上面踩了一个坑,所以研究了一下. 在阅文做了两个ReactNative混合开发的项目,都用npm run bundl ...
- bug和注意事项
bug: 1.新增角色,在选择权限树的时候,如果不选择根目录下的第一个节点,保存后,权限树会打不开. 2.文档页面有两个大字段,即ueditor编辑器的时候,保存后回显会有问题 不过一个页面有两个大文 ...