编程 Javascript

js实现背景图片感应鼠标变化的方法

Posted in Javascript onFebruary 28, 2015

本文实例讲述了js实现背景图片感应鼠标变化的方法。分享给大家供大家参考。具体分析如下：

鼠标点击后背景图片变化，点击另外一个菜单项前面的会自动恢复背景，其实这个如果单纯使用CSS是没办法做的，我们还要使用JS来判断鼠标状态，代码如下：

<style type="text/css"> 
.dh a{
background:#FFFFCC;
width:50px;
height:30px;
display:block; 
text-align:center;
color:#000000;
} 
.dh a:hover{
background:#FF9900;
} 
</style> 
</head> 
<body> 
<div> 
 <div class="dh"><a href="#">导航1</a></div> 
 <div class="dh"><a href="#">导航2</a></div> 
 <div class="dh"><a href="#">导航3</a></div> 
 <div class="dh"><a href="#">导航4</a></div> 
 <div class="dh"><a href="#">导航5</a></div> 
</div> 
<script type="text/javascript"> 
$(function(){ 
  $(".dh a").click(function(){ 
    $(".dh a").removeAttr("style"); 
    $(this).attr("style","background:#CCFF99;"); 
  }) 
}) 
</script>

希望本文所述对大家的javascript程序设计有所帮助。

js实现背景图片感应鼠标变化的方法

- Author -

shichen2014

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

任意位置显示html菜单

Feb 01 Javascript

2012年开发人员的16款新鲜的jquery插件体验分享

Dec 28 Javascript

jQuery动画animate方法使用介绍

May 06 Javascript

原生js获取宽高与jquery获取宽高的方法关系对比

Apr 04 Javascript

javascript实现延时显示提示框特效代码

Apr 27 Javascript

js判断某个字符出现的次数的简单实例

Jun 03 Javascript

全面了解JavaScirpt 的垃圾(garbage collection)回收机制

Jul 11 Javascript

微信小程序网络API发起请求详解

Nov 09 Javascript

vue实现列表的添加点击

Dec 29 Javascript

JavaScript下拉菜单功能实例代码

Mar 01 Javascript

微信小程序实现滑动删除效果

May 19 Javascript

详解Vue-Router源码分析路由实现原理

May 15 Javascript

常用的JavaScript模板引擎介绍

Feb 28 #Javascript

JavaScript操作Cookie详解

Feb 28 #Javascript

js实现可得到不同颜色值的颜色选择器实例

Feb 28 #Javascript

JS+CSS实现实用的单击输入框弹出选择框的方法

Feb 28 #Javascript

JS实现很酷的EMAIL地址添加功能实例

Feb 28 #Javascript

浅谈JavaScript数据类型及转换

Feb 28 #Javascript

javaScript基础语法介绍

Feb 28 #Javascript