<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. 基于 react-navigation 父子组件的跳转链接

    1.在一个页面中中引入一个组件,但是这个组件是一个小组件,例如是一个cell,单独的每个cell都是需要点击有链接跳转的,这个时候通常直接使用 onPress 的跳转就会不起作用 正确的处理方法是,在 ...

  2. day37-3 异常处理

    目录 异常处理 捕捉异常 raise assert 异常处理 捕捉异常 语法错误无法通过try检测,就像函数一样 try: 1/0 except Exception as e: # Exception ...

  3. HTML 1.1页面js修改文字颜色

    昨天的报告页面,想要实现根据不同文字内容改变字体颜色,效果图: 调试了半天出不来效果,最后请教了前端,上代码: <!DOCTYPE html> <html lang="en ...

  4. 7.5 pragma 指令

    第1个pragma禁用了我们感兴趣的特别警告,第2个恢复了它.禁用尽可能小的一段代码的警告是一个良好的做法,以便你不会错过任何真正应该修复的错误.如果你想在单独一行上禁用或恢复多个警告,那么只需用逗号 ...

  5. 【ACM】hdu_zs1_1001_水仙花数_201307271504

    水仙花数 Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other)Total Submissio ...

  6. iostat -x 1 查看磁盘的IO负载

    Linux系统出现了性能问题.一般我们能够通过top.iostat,vmstat等命令来查看初步定位问题.当中iostat能够给我们提供丰富的IO状态数据 $ iostat -x -1  avg-cp ...

  7. Ruby 读取文件

    Ruby 读取文件 一次全读出来 textAll = File.read("fileName.txt") puts textAll 一次读取一行 file = File.open( ...

  8. java5核心基础之泛型（3）-泛型作用于编译阶段-怎样将String对象传入Integer类型的泛型对象中？

    泛型作用于编译阶段: 泛型是作用于编译阶段,在编译阶段控制类型,以确保在编写代码的时候仅仅能传入指定类型数据到泛型集合对象中去. 怎样验证呢,贴代码例如以下: package highBasic.ge ...

  9. 【传智播客VIP用户专享】Swift教程最新更新

    (1)[传智播客VIP用户专享]Swift教程最新更新 特地贡献出来忘帮顶!!(传智内部学院给的) http://pan.baidu.com/s/1jGmRRIu    提取码:i11g 相关资料下载 ...

  10. Create and Call HttpHandler in SharePoint

    Create and Call HttpHandler in SharePoint Requirement: 1. Create a httphandler, and reture json data ...