基于jquery实现的鼠标滑过按钮改变背景图片

代码如下:

$(document).ready(function () {
//按钮样式切换
$("#btFeedBack").hover(
function () {
$(this).removeClass("btFeed").addClass("btFeedhover");
},
function () {
$(this).removeClass("btFeedhover").addClass("btFeed");
}
);

});

赞 (0)

相关推荐

  • jquery给图片添加鼠标经过时的边框效果

    一哥们儿要给图片添加鼠标经过时的边框效果,可惜出发点错了,直接加在了IMG外的A标签上致使 鼠标经过时图片产生塌陷,实则应该将边框控制直接加在IMG标签上即可 错误代码如下:注意红色部分设置 (出发点就错了) 复制代码 代码如下: <html> <head> <script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery.js"></s

  • jquery实现图片跟随鼠标的实例

    jquery实现图片跟随鼠标的实例 开发后台写页面困难的一比啊,想写个鼠标移动某连接右侧显示二维码,并跟随鼠标移动的功能,各种查资料,花了一小天终于搞出来了,代码的记下来,浪费了我这么多时间,记你一辈子,这个可以直接在W3School直接运行,可以根据某行显示某个特定的图片,自己定义就行 实现代码: <html> <head> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"><

  • jquery实现鼠标拖动图片效果示例代码

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • jQuery当鼠标悬停时放大图片的效果实例

    jQuery当鼠标悬停时放大图片的效果实例

    这个效果最初源于小敏同志的一个想法,刚开始做的时候只能实现弹出的图片是固定的,不能随鼠标移动,最后加以改善,终于实现了比较理想的效果.今天就把制作该效果的经验与大家一同分享.先看看最终效果演示: HTML结构部分:先编写一个无序列表的结构,a标签中的img标签用来存放小图片,a标签添加一个rel属性,用来存放大图片的路径. 复制代码 代码如下: <UL id=gallery sizcache="6" sizset="7">  <LI sizcach

  • 基于jquery的滚动鼠标放大缩小图片效果

    今天要出个鼠标滚动放大缩小图片的功能,看似很简单,从网上一搜,出现的都是onmousewheel的例子,全部只支持IE浏览器,结果查出火狐有对应的DOMMouseScroll来处理这个功能,代码如下,并加上注意的注释项: 复制代码 代码如下: $(function(){ $(".body img").each(function(){ if($.browser.msie){ $(this).bind("mousewheel",function(e){ var e=e|

  • 基于jquery实现一张图片点击鼠标放大再点缩小

    复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="jquery-1.8.3.min.js"></script> <sc

  • 基于jquery的仿百度的鼠标移入图片抖动效果

    1.查看源文件,在查看后很纳闷的发现,此页并没有包含那些奖品信息.这样就断定代码在另一个页面中.于是想当然的以为是用的框架连接的地址.结果没查到,却看到了一个这样的信息: 复制代码 代码如下: <div id ="task-intro-box"><!--活动说明--></div> <div id ="task-awards"><!--活动奖励--></div> <div id ="

  • 基于jquery实现的鼠标滑过按钮改变背景图片

    复制代码 代码如下: $(document).ready(function () { //按钮样式切换 $("#btFeedBack").hover( function () { $(this).removeClass("btFeed").addClass("btFeedhover"); }, function () { $(this).removeClass("btFeedhover").addClass("btF

  • jQuery实现的鼠标滑过弹出放大图片特效

    jQuery实现的鼠标滑过弹出放大图片特效

    本章节介绍一下一种比较常用的效果,那就是当鼠标滑过链接的时候,能够出现跟随鼠标指针移动的图层,在实际应用中,一般是对于链接的一些说明文字或者图片等等, 我们先来看个演示图 下面是代码实例: <link rel="stylesheet" href="../css/common.css" type="text/css" /> <script type="text/javascript" src="../

  • jquery简单实现鼠标经过导航条改变背景图

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • Jquery幻灯片特效代码分享--鼠标滑过按钮时切换（2）

    Jquery幻灯片特效代码分享--鼠标滑过按钮时切换（2）

    这篇文章主要介绍了jQuery实现幻灯片焦点图,可实现非常炫目时尚的幻灯片效果,非常具有实用价值,基本能满足你在网页上使用幻灯片(焦点图)效果,具体如下 幻灯片效果描述:用鼠标滑过右下角数字按钮幻灯片进行左右切换进行切换. 自定义切换参数效果:向下切换.切换时间为8秒.鼠标滑过按钮时切换   运行效果截图如下: 具体代码如下 <head> <title>Jquery幻灯片焦点图插件</title> <script src="js/jquery-1.4a2

  • jQuery实现鼠标滑过Div层背景变颜色的方法

    本文实例讲述了jQuery实现鼠标滑过Div层背景变颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>jQuery实现感应鼠标经过Div层变换图层背景颜色)</title> <style type="text/css"> .divbox{   height:300px;   width:200px;   background:#ffffff;   border

  • 鼠标滑过缩略图时放大图片（纯Css）

    鼠标滑过缩略图时放大图片（纯Css）

    写着好玩的,并无技术含量,见笑了.没有使用到Js,纯Css控制的.弹出的图片不会把旁边的容器"挤"开. 测试通过IE7 Firefox2.11.(理论兼容IE6) www.jb51.net 我们 鼠标滑过缩略图时放大图片 本例旨在展示鼠标滑到缩略图上时,放大图片. [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • JS实现鼠标滑过链接改变网页背景颜色的方法

    JS实现鼠标滑过链接改变网页背景颜色的方法

    本文实例讲述了JS实现鼠标滑过链接改变网页背景颜色的方法.分享给大家供大家参考,具体如下: 这个小特效很不错,用链接改变网页背景色,鼠标放上链接文字上,网页背景就会跟着变换,想让你的主页更个性一点的朋友,这个代码一定能用上,其实你可在此基础上修改一下代码,改成鼠标放上文字切换样式表,这样整个网页就变了风格,是不是很实用? 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-mouse-over-link-cha-bgcolor-demo/ 具体

  • js实现按钮加背景图片常用方法

    本文实例讲述了js实现按钮加背景图片常用方法.分享给大家供大家参考.具体实现方法如下: 方法一: 复制代码 代码如下: <input type="submit" onMouseOver="style=background:url('imgs/jb51.gif')"/> 方法二: 复制代码 代码如下: <input type="button" value="提交" style="background:

  • pyqt5实现按钮添加背景图片以及背景图片的切换方法

    简介 对与控件QPushButton中的可以使用setStyleSheet设置它背景图片.具体设置背景图片的方法有两种 self.button.setStyleSheet("QPushButton{background-image: url(img/1.png)}") 然而对于这种方法背景图片无法进行边框的自适应,可以使用下面的方法 self.button.setStyleSheet("QPushButton{border-image: url(img/1.png)}&quo

  • jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果

    jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果

    复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动</title> <meta name="description" cont

随机推荐