<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
#div1 {
width: 100px;
height: 100px;
background: red;
}
</style> <script>
function togreen(){
var green=document.getElementById('div1');
green.style.width='200px';
green.style.height='200px';
green.style.background='green';
}
function tored() {
var green=document.getElementById('div1');
green.style.width='100px';
green.style.height='100px';
green.style.background='red';
}
</script> </head> <body>
<div id="div1" onMouseOver="togreen()" onMouseOut="tored()">
</div>
</body>
</html>

查看原文

JavaScript实现鼠标效果的更多相关文章

  1. JavaScript判断鼠标滑轮是向下还是向上滚动

    我们常用的就是鼠标,鼠标中键一般都用于滑动网页,但是网页中很多很炫的效果,使用鼠标滑轮操作更好. 当然对于手机就没有这个设备了,所以就不用考虑手机端的实现方法,手机端有触摸滑动事件. 使用JavaSc ...

  2. JavaScript之放大镜效果2

    在放大图片效果的同时,我们怎么原图和放大窗体增加间隔呢? 我们只需应用一个table就行了: 源码上: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML ...

  3. JavaScript之放大镜效果

    在网上也浏览过许多关于JavaScript放大镜效果的文章,有的代码解释得些隐晦难懂,看的我头有点晕晕的╮(╯﹏╰)╭,我的心情是这样的: 吐槽完了,我们动动小鼠标,当鼠标经过下面这张美女图片时就实现 ...

  4. javascript图片放大镜效果展示

    javascript图片放大镜效果展示 <!DOCTYPE html> <html> <head lang="en"> <meta cha ...

  5. JavaScript实现拖放效果

    JavaScript实现拖放效果 笔者实现该效果也是套用别人的轮子的.传送门 然后厚颜无耻的贴别人的readme~,笔者为了方便查阅就直接贴了,有不想移步的可以看这篇.不过还是最好请到原作者的GitH ...

  6. 通过HTML+CSS+JavaScript实现鼠标移动到页面顶部导航栏出现,如果移出导航栏3秒又隐藏起来,而且不受滚动条影响(二)

    通过HTML+CSS+JavaScript实现鼠标移动到页面顶部导航栏出现,如果移出导航栏3秒又隐藏起来,而且不受滚动条影响(二) 效果:默认一直隐藏导航栏,当滚动条滚到超过300px按钮出现,点击回 ...

  7. JavaScript 省市级联效果

    JavaScript 省市级联效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  8. Rainyday.js – 使用 JavaScript 实现雨滴效果

    Rainyday.js 背后的想法是创建一个 JavaScript 库,利用 HTML5 Canvas 渲染一个雨滴落在玻璃表面的动画.Rainyday.js 有功能可扩展的 API,例如碰撞检测和易 ...

  9. JavaScript实现动画效果

    说到JavaScript实现动画效果,不得不想到两个函数,setTimeout和setInterval. setTimeout的常用的使用方法为 setTimeout(callback, delay) ...

随机推荐

  1. pycharm主题 变量颜色 自定义

    File--Settings--Edtior--Color Schame-- Lanuage Defaults

  2. mac nwjs入门

    NW.js由node-webkit项目发展而来其实很多东西官网上都有.但是鉴于搜索引擎(百度,google)搜索到的相关文章,让人看的很不明白.所以决定写下此篇文章. 官网:https://nwjs. ...

  3. 在Unity中客户端与服务器端的2种通信方式(Socker)

    15:17 2019/5/10 //第一种 using UnityEngine; using System.Collections; //引入库 using System.Net; using Sys ...

  4. atcoder.keyence2019.contest E-Connecting Cities

    真是道好题啊,当时怎么想都没想出来... 传送门 简述题意: 有n个点,每个点有一个权值Ai,连接i,j两个点的代价是 |i−j|×D+Ai+Aj  其中D是给定的常数,问把n个点联通的最小代价 1≤ ...

  5. python之testlink模块

    1.安装:pip install TestLink-API-Python-client >>>>>>待续

  6. 分别用for循环,while do-while以及递归方法实现n的阶乘!

    分别用for循环,while do-while以及递归方法实现n的阶乘! 源码: package book;import java.util.Scanner;public class Access { ...

  7. springcloud(一):初识springcloud

    研究了一段时间Spring Boot了准备向Spring Cloud进发,公司架构和项目也全面拥抱了Spring Cloud.在使用了一段时间后发现Spring Cloud从技术架构上降低了对大型系统 ...

  8. vue项目初始化结构

  9. java反射,简单demo

    直接上码 //获取方法.属性.构造函数时加 Declared 表示获取本类全部的,不分修饰符:不加 Declared 表示获取从父类继承的和本类公共的 //获取 First 类的无参构造函数 Cons ...

  10. AM335X开发板+4G模块 调试小结

    1.找到开发版配套资料中的linux内核源码包linux-3.2.0-Litev2.3-nand-2017-3-24.tar.gz 2.解压内核源码包,打开内核源码文件 option.c(路径为 dr ...