<!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. 组合优化学习笔记<之>从贪心算法到子集系统再到拟阵

    贪心算法是用的比较多的一种优化算法,因为它过程简洁优美,而且结果有效.有些优化问题如最大权森林(MWF)是可以用贪心问题求解的,由于最小支撑树(MST)问题与MWF是等价的,所以MST也是可以用贪心算 ...

  2. CSS实现文字内容不被截断当超出指定长度时该字符串自动整体换到下一行

    效果图: 1.内容不被截断 span {       overflow:hidden;       white-space:nowrap;       text-overflow:ellipsis;  ...

  3. RAM的分类

    转载自:http://wenku.baidu.com/view/b17d73244b35eefdc8d333ab.html RAM(随机存储器)可以分为SRAM(静态随机存储器)和DRAM(动态随机存 ...

  4. IO多路复用模型之epoll实现机制

    设想一下如下场景:有100万个客户端同时与一个服务器进程保持着TCP连接.而每一时刻,通常只有几百上千个TCP连接是活跃的(事实上大部分场景都是这种情况).如何实现这样的高并发? 在select/po ...

  5. 四、mysql数据常用命令

    1.显示mysql中所有数据库的名称,show databases; 2.访问某个数据库,use database_name; 3.显示当前数据库中所有表的名称,show tables; 4.查看当前 ...

  6. 3.15-3.21 hive项目实战

    一.创建表并导入日志数据,引出问题 ##建表 hive (default)> create table IF NOT EXISTS default.bf_log_src( > remote ...

  7. CodeForces 748C Santa Claus and Robot (思维)

    题意:给定一个机器人的行走路线,求最少的点能使得机器人可以走这样的路线. 析:每次行走,记录一个方向向量,每次只有是相反方向时,才会增加一个点,最后再加上最后一个点即可. 代码如下: #pragma ...

  8. Oracle中的集合运算

    前言:在实际项目中对多表进行集合运算使用非常广泛,以下是对集合操作的部分总结. 一,建表,插入测试数据 create table a( numbers integer ) create table b ...

  9. IsPostBack深入探讨

    1IsPostBack介绍 IsPostBack是Page类有一个bool类型的属性,用来判断针对当前Form的请求是第一次还是非第一次请求.当IsPostBack＝true时表示非第一次请求,我们称 ...

  10. 网络编程-TCP连接-readLine

    Server: package com.net.tcp; import java.io.BufferedReader; import java.io.IOException; import java. ...