Js onmouseover和onmouseout小特效
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
<style>
div{float:left;margin:20px;}
#div1{width:100px;height:100px;background: #f00;}
#div2{width:200px;height:200px;background:#ccc;display: none;}
</style>
<script type="text/javascript">
window.onload=function(){
var oDiv1=document.getElementById("div1");
var oDiv2=document.getElementById("div2");
var timer=null;
oDiv1.onmouseover= oDiv2.onmouseover=function(){
clearTimeout(timer);
oDiv2.style.display="block";
}
oDiv1.onmouseout= oDiv2.onmouseout=function(){
timer=setTimeout(function(){
oDiv2.style.display="none";
},500)
} }
</script>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>
Js onmouseover和onmouseout小特效的更多相关文章
- JS:onmouseover 、onmouseout
鼠标移动到P标签上时,改变文本和边框样式 <style type="text/css"> .onmouseover { color: red; border: 1px ...
- js onmouseover与onmouseout用法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- JS事件之onmouseover 、onmouseout 与onmouseenter 、onmouseleave区别
疫情过后回武汉的第一天打卡,今天偶然遇到一个问题onmouseover .onmouseout 与onmouseenter .onmouseleave这些事件的区别,也看了一些博客,感觉不是很清楚,所 ...
- javascript学习-原生javascript的小特效（多物体运动效果）
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 今天为大家做的是多个物体的运动效果, 1:HTML <body> <ul> <li> ...
- javascript学习-原生javascript的小特效（改变透明度效果）
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 ( 以下效果兼容IE5+ IE5-以下没有测试哦) 今天为大家演示的效果是一个div,鼠标经过的时候透明度为100%,鼠标移出的时 ...
- javascript学习-原生javascript的小特效（简单的运动效果）
前些日子看了个视频所以就模仿它的技术来为大家做出几个简单的JS小特效 一:运动特效(主要是通过改变元素的left,right,height,width,opacity来达到运动的效果) 我们今天做一个 ...
- javascript学习-原生javascript的小特效（原生javascript实现链式运动）
以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ...
- javascript学习-原生javascript的小特效（多个运动效果整理）
以下代码就不详细解析了,在我之前的多个运动效果中已经解析好多次了,重复的地方这里就不说明了,有兴趣的童鞋可以去看看之前的文章<原生javascript的小特效> <!DOCTYPE ...
- 关于onmouseover和onmouseout的bug
总结了一下关于使用onmouseover以及onmouseout会出现的bug 首先简单的布局: <div id="box"> <div>这是一个内容< ...
随机推荐
- 打开Eclipse出现“An internal error has occurred. java.lang.NullPointerException
今天打开eclipse出现了这个问题:下面是老外给出的办法,粘给大家: Instead of deleting the whole .metadata folder, just delete the ...
- 洛谷 P1065 作业调度方案
P1065 作业调度方案 题目描述 我们现在要利用 mm 台机器加工 nn 个工件,每个工件都有 mm 道工序,每道工序都在不同的指定的机器上完成.每个工件的每道工序都有指定的加工时间. 每个工件的每 ...
- 洛谷 P4379 [USACO18OPEN]Lemonade Line
P4379 [USACO18OPEN]Lemonade Line 题目描述 这是农场上一个炎热的夏日,Farmer John要给他的 NN 头奶牛发柠檬汽水了!所有的 NN 头奶牛(方便起见,编号为 ...
- Redis Cluster集群搭建后，客户端的连接研究（Spring/Jedis）（待实践）
说明:无论是否已经搭建好集群,还是使用什么样的客户端去连接,都是必须把全部IP列表集成进去,然后随机往其中一个IP写. 这样做的好处: 1.随机IP写入之后,Redis Cluster代理层会自动根据 ...
- 【.Net 学习系列】-- .Net 指定时间段内定时执行的Windows服务（System.Threading.Thread）
创建一个Windows服务项目:解决方案(右击)——> 添加 ——> 新建项目——>项目类型选择Windows——>模板选择Windows服务 ,如图: 编写Windows服务 ...
- 在HTML中显示图片时希望如果图片不存在或者无法显示时,能够显示默认图片
很多时候,在HTML中显示图片时希望如果图片不存在或者无法显示时,能够显示默认图片.可以通过以下方式: <img src="xxx.jpg" onError="th ...
- 理解C语言中指针的声明以及复杂声明的语法
昨天刚把<C程序设计语言>中"指针与数组"章节读完,最终把心中的疑惑彻底解开了.如今记录下我对指针声明的理解.顺便说下怎样在C语言中创建复杂声明以及读懂复杂声明. 本文 ...
- Python的lambda函数与排序
Python的lambda函数与排序 2010-03-02 15:02 2809人阅读 评论(0) 收藏 举报 lambdapythonlistlispclass工作 目录(?)[+] 前几天 ...
- easyUI datagrid 前端假分页
datagrid有两种分页方式,真分页和假分页. 所谓真分页,就是真的每次只获取一张分页的数据. 所谓假分页,就是将所有数据全部获取下来,然后利用其分页控件进行分页. 下面具体说说假分页: 1.dat ...
- Apache2.2安装
貌似Apache官网从2.2.X之后不再发布Windows安装版本,需要的话得自己编译 从官网下载2.2.25(我下了一个no-ssl的),安装提示 因为本机已经安装IIS,占用80端口,修改Apac ...