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 ...
随机推荐
- redis初步入门(1)
一.redis是一款高性能NOSQL系列的非关系型的数据库,其是用C语言开发的一个开源高性能键值对(key-value)数据库. 二.redis的应用场景 1.缓存(数据查询.短连接.新闻内容.商品内 ...
- python yield 和 yield from用法总结
#例1. 简单输出斐波那契數列前 N 个数#缺点:该函数可复用性较差,因为 fab 函数返回 None,其他函数无法获得该函数生成的数列#要提高 fab 函数的可复用性,最好不要直接打印出数列,而是返 ...
- XV Open Cup named after E.V. Pankratiev. GP of Three Capitals
A. Add and Reverse 要么全部都选择$+1$,要么加出高$16$位后翻转位序然后再补充低$16$位. #include<stdio.h> #include<iostr ...
- vue_class 绑定_style 绑定
1. class 绑定 data: { myClass: "bClass", hasA: true, hasB: false } 字符串模式: 类名不确定 <p class= ...
- 6. 深度克隆_ES7**_arr.includes('孙悟空')
1. 如何实现深度克隆 利用 JSON 方法 (没办法克隆函数数据) `JSON.parse(JSON.stringify(xxx))` 自定义方法 检查所有数据类型的方法 `Object.proto ...
- 【管理篇】用户故事STORY
项目管理中,常常听说story,用户故事 “一开始就做对系统”纯属神话,反之,我们应该去实现今天的用户故事,然后重构,明天再拓展系统.实现新的用户故事.这就是迭代和增量敏捷的精粹所在.
- 【TensorFlow使用教程】1 环境搭建
一.TensorFlow主要依赖包——Protocol Buffer & Bazel 1. Protocol Buffer 首先要弄清三个概念: 结构化数据:指拥有多种属性的数据,例如用户信息 ...
- 【C++】约瑟夫环（数组+链表）
基于数组: #include<iostream> #include<cstring> #include<cstdlib> using namespace std; ...
- Express全系列教程之(七)：cookie的加密
一.关于cookie加密 cookie加密是让客户端用户无法的值cookie明文信息,是数据安全的重要部分:一般的我们可以在保存cookie时对cookie信息进行加密,或者在res.cookie中对 ...
- Mock Server 实现post方法的接口（三）
Mock Server 实现post方法的接口(三) 1.mock server实现的接口,当request中未设置"method"时,会自动将所有method试一次,所以一定要指 ...