<!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style type="text/css">

         #div1{

             width: 200px;

             height: 50px;

             background-color: orange;

         }

     </style>

     <script type="text/javascript">

     function toGreen(){

         document.getElementById('div1').style.background='green';

     }

     function toOrange(){

         document.getElementById('div1').style.background='orange';

     }

     </script>

 </head>

 <body>

     <div id="div1" onmouseover="toGreen()" onmouseout="toOrange()"></div>

 </body>

 </html>

JS鼠标效果的更多相关文章

  1. js 鼠标效果

    一. 鼠标悬停效果和离开效果 鼠标效果和v-if 配合使用效果很好 <a class="all btn" href="#" v-on:mouseover= ...

  2. js鼠标滚轮滚动图片切换效果

    效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...

  3. js鼠标移入移出效果【原】

    <HTML> <HEAD> <!-- meta 解释 : http://www.haorooms.com/post/html_meta_ds --> <met ...

  4. JS鼠标滚动插件scrollpath使用介绍

    JS鼠标滚动插件scrollpath:在这个插件中首先要引人的JS是jQuery,因为后面的JS都是基于它的.再者需要引入的是jquery.scrollpath.js.scrollpath.css还有 ...

  5. 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结

    史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...

  6. JS原生效果瀑布流布局的实现(一)

    JS原生效果 实现: HTML页面布局: <!DOCTYPE html> <html> <head> <meta charset="utf-8&qu ...

  7. js sleep效果

    js sleep效果 s = setInterval(function(){ //需要执行的函数 alert("我延迟了2秒弹出"); },2000); 并不是每2秒执行一次,而是 ...

  8. js 鼠标事件的抓取代码

    js 鼠标事件的抓取代码,分享给大家. 1.通过ele.setCapture();设置鼠标事件的抓取. 2,应用可以通过单.双击文字来获取时间. <html> <head> & ...

  9. JS打字效果的动态菜单代码分享

    这篇文章主要介绍了JS打字效果的动态菜单,推荐给大家,有需要的小伙伴可以参考下. 这是一款基于javascript实现的打字效果的动态菜单特效代码,分享给大家学习学习. 小提示:浏览器中如果不能正常运 ...

随机推荐

  1. Java的动态代理Proxy

    概念梳理: 1.什么是动态代理? 答:动态代理可以提供对另一个对象的访问,同时隐藏实际对象的具体事实.代理一般会实现它所表示的实际对象的接口.代理可以访问实际对象,但是延迟实现实际对象的部分功能,实际 ...

  2. 用户Bug修补报告

    用户Bug修补报告 虽然经过许多天的奋斗,我们的U-Help已经正式投入使用,不过在使用过程中遇到了大大小小的问题,我们通过努力修补了其中的相当一部分,以下是用户Bug修补报告. 7.31:发布bet ...

  3. 关于GeneXus封装方法Model的方法

     最近 刚从外地出差回来 工作任务不是很重 能够抽点时间记点东西 下午花了2个多钟头尝试了一下GeneXus的封装方法的功能,这里记一下便于自己以后查看.我们在许多项目中或多或少都会有着重复代码编写的 ...

  4. Nginx 常用基础模块

    目录 Nginx 常用基础模块 Nginx日志管理 nginx日志切割 Nginx目录索引 Nginx状态监控 Nginx访问控制 Nginx访问限制 Nginx 请求限制配置实战 Nginx Loc ...

  5. 入门phantomjs

    前言 phantomjs是一个无界面浏览器,用来操作web页面的一个工具,比如登录,提交表单等等. 语法框 //创建一个浏览器对象 var page = require('webpage').crea ...

  6. Nginx有哪些作用？

    Nginx有哪些作用? http协议代理 搭建虚拟主机 服务的反向代理 在反向代理中配置集群的负载均衡   什么是正向代理? 正向代理,意思是一个位于客户端和原始服务器(origin server)之 ...

  7. egg 连接mysql 在mysql 插入数据

    1.配置mysql exports.mysql = { enable: true, package: 'egg-mysql' }; 'use strict'; module.exports = app ...

  8. linux rsync 复制文件忽略文件夹

    比如: /home/vagrant/test 目录下有 a,b,c 三个文件夹,只复制 c 文件夹下面的文件到/home/vagrant/test2 下 使用cp命令复制的时候,只能排除一个目录不被复 ...

  9. idea maven打jar包

    双击clean install 会在根目录targer生成文件(注意删除test和替换yml文件)

  10. SCP-bzoj-4734

    项目编号:bzoj-4734 项目等级:Safe 项目描述: 戳这里 特殊收容措施: 附录: #include <bits/stdc++.h> #define range(i,c,o) f ...