<!doctype html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <style type="text/css">

     body,ul,li{margin:0; padding:0; list-style:none}

     ul li{width:100px; height:100px; border:1px solid #f00; float:left; margin:50px 10px; background-color:#ffffff;}

     ul li.current{border:1px solid #dfdfdf; background-color:#ff0000;}

 </style>

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

 </head>

 <body>

     <h1>鼠标经过下面的块</h1>

     <ul>

         <li></li>

         <li></li>

         <li></li>

         <li></li>

     </ul>

 </body>

 </html>

 <script type="text/javascript">

     $("ul li").mouseover(function()

     {

          $(this).addClass("current");

     }).mouseout(function()

     {

         $(this).removeClass("current");

     });

 </script>

低版本浏览器不支持hover伪类，这段代码可以解决这个问题。实现完美兼容。

简单的鼠标经过特效-mouse事件的更多相关文章

  1. 鼠标mouse事件冒泡处理

    简单的鼠标移动事件: 进入 mouseenter:不冒泡 mouseover: 冒泡 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件 只有在鼠标指针穿过被选元素时,才会触发 m ...

  2. Raphael的鼠标over move out事件

    Raphael的鼠标over move out事件 <%@ page language="java" contentType="text/html; charset ...

  3. Javascript 简单实现鼠标拖动DIV

    http://zhangbo-peipei-163-com.iteye.com/blog/1740078 比较精简的Javascript拖动效果函数代码 http://www.jb51.net/art ...

  4. 巧用CSS属性visibility与opacity代替鼠标经过的jQuery事件

    一直使用jQuery的hover()函数来写鼠标经过事件,这几天发现其他同行直接使用CSS就搞定了.自己在线下也试了试: 当然也并不是没有前提条件,需要配合一些定位属性来使用(position/top ...

  5. onmouse事件与mouse事件

    1.mouse是js,onmouse是html的,其实差别就是加了一个on 2.mouse事件:鼠标移动时:1>会有冒泡的:mouseover ,mouseout 2>没有事件冒泡的: m ...

  6. 鼠标焦点变化引起mouseout事件

    做了个小手术,渐渐回归网络啦! 问题: 在自制的提示离鼠标太近时,会引起无法提示的功能. 自制提示离图片太近时,提示图片一直一闪一闪的,截图截不出来,就只放改善后的图片(不闪). 原因: 为什么呢?书 ...

  7. Qt 鼠标样式特效探索样例（一）——利用时间器调用QWidget.move()函数

    Qt 鼠标样式特效探索样例(一)       心血来潮,突然想在Qt里玩一把鼠标样式,想到在浏览网页时,经常看到漂亮的鼠标动画,于是今天摸索着乱写个粗糙的demo,来满足自己的好奇心. 效果图 方案要 ...

  8. 一款基于css3非常实用的鼠标悬停特效

    今天给大家带来一款基于css3非常实用的鼠标悬停特效.这款特效,当鼠标经过时候一个半透明的遮罩层倒下来.效果很好,而且是纯css3实现的,代码很少,非常实用. 效果如下: 在线预览   源码下载 实现 ...

  9. 一款基于css3的简单的鼠标悬停按钮

    今天给大家分享一款基于css3的简单的鼠标悬停按钮.这款悬停按钮鼠标经过前边框是间断的.当鼠标经过的时候边框间隔消失.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

随机推荐

  1. 基于深度学习和迁移学习的识花实践——利用 VGG16 的深度网络结构中的五轮卷积网络层和池化层，对每张图片得到一个 4096 维的特征向量，然后我们直接用这个特征向量替代原来的图片，再加若干层全连接的神经网络，对花朵数据集进行训练（属于模型迁移）

    基于深度学习和迁移学习的识花实践(转)   深度学习是人工智能领域近年来最火热的话题之一,但是对于个人来说,以往想要玩转深度学习除了要具备高超的编程技巧,还需要有海量的数据和强劲的硬件.不过 Tens ...

  2. php字符串啊的heredoc格式

    Heredoc技术,在正规的PHP文档中和技术书籍中一般没有详细讲述,只是提到了这是一种Perl风格的字符串输出技术.它也出现unix/linux的shell编程里面.但是现在的一些论坛程序,和部分文 ...

  3. codeforces 664C C. International Olympiad(数学)

    题目链接: C. International Olympiad time limit per test 1 second memory limit per test 256 megabytes inp ...

  4. bootstrap 学习笔记（2）---- 排版

    安装和栅格系统学完,这篇写的是排版手册中排版的目录如下图 <标题,页面主题,内联文本元素,对齐,改变大小写,缩略语,地址,引用,列表>手册中介绍那么多,其实并不是所有的都要去看看.很多都是 ...

  5. BZOJ2120：数颜色（数状数组套主席树）（带修改的莫对）

    墨墨购买了一套N支彩色画笔(其中有些颜色可能相同),摆成一排,你需要回答墨墨的提问.墨墨会像你发布如下指令: 1. Q L R代表询问你从第L支画笔到第R支画笔中共有几种不同颜色的画笔. 2. R P ...

  6. 图片轮播和C3动画

    值得注意的地方是:如果在图片下面的li做背景图片,可以把li上的数字或者文本设置为transparent(透明色),这样的话既可以实现轮播的定时器效果,也可以让li上有C3动画效果.如果li上的文字不 ...

  7. python2代码批量转为python3代码

    由于python存在python2和python3两个主要的版本方向,经常会有将python2的代码转到python3的环境下运行的需求.尤其是跑一些神经网络的代码时有很多是在python2的环境下写 ...

  8. twincat3新建cpp提示"在查找预编译头时遇到意外的文件结尾。是否忘记了向源中添加“#include "stdafx.h"

    自己之前在windows下面写过一些c++的函数,想在倍福工控机上直接使用,发现添加了.cpp和.h文件后无法完成编译,会提示 在查找预编译头时遇到意外的文件结尾.是否忘记了向源中添加“#includ ...

  9. CF-799B

    B. T-shirt buying time limit per test 3 seconds memory limit per test 256 megabytes input standard i ...

  10. Spring Boot 学习系列（04）—分而治之，多module打包

    此文已由作者易国强授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 明确功能,各司其职 在一个结构清晰的项目中,一个没有module划分的结构显然不是最佳实践.有人会说可以在同 ...