这个是javascript的写法

<img src="res/img/shop-c_32.jpg" alt="" onmouseover="this.src='res/img/shop-c_29.jpg';" onmouseout="this.src='res/img/shop-c_32.jpg';">

这是个jquery的写法

<img src="res/img/shop-c_32.jpg" data-back="res/img/shop-c_29.jpg">

再加上jquery的效果写法

<script>
$("img[data-back]").hover(function(){
$(this).data('fallback',$(this).attr('src'));
$(this).attr('src',$(this).data('back'));
},function(){
$(this).attr('src',$(this).data('fallback'));
}); </script>

我比较倾向于后者的写法。那大家觉得呢?

js和jquery 两种写法 鼠标经过图片切换背景效果的更多相关文章

  1. (转载)无缝滚动图片的js和jquery两种写法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)

    1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...

  3. 常见浏览器的宽高代码写法!有原生JavaScript和jquery两种写法-------------------------------以及我的个人网站

    我的个人网站 点击链接!欢迎大家访问 下面是网页一些常见的宽高的获取.........这是原生的写法(JavaScript) 网页可见区域宽: document.body.clientWidth 网页 ...

  4. JS对象转URL参数(原生JS和jQuery两种方式)

    转自:点击打开链接 现在的js框架将ajax请求封装得非常简单,例如下面: $.ajax({ type: "POST", url: "some.php", da ...

  5. js对象的两种写法

    <script>     //定义一个对象,提供对应的方法或者属性     var s = {         sd1: function () { },         sd2: fun ...

  6. 【分享】jQuery无插件实现 鼠标拖动图片切换 功能

    前言 我就想随便叨逼叨几句,爱看就看几句,不爱看就直接跳过看正文就好啦~ 这个方法是仿写页面时我自己研究出来,可能有比我更简单的方法. 但我不管,因为我没查我不知道,我就觉得我的最好啦,耶耶耶~ 效果 ...

  7. angularjs 代码结构两种写法

    1.当路由中不写controller的时候,controller写在对应的html表单中 2.若要写在路由中,如下 3.转到相应的路由(页面) 1.采用location服务 2.采用 transiti ...

  8. controller 有两种写法,讨论一下两种写法的区别:

    controller 有两种写法,讨论一下两种写法的区别: 写法 1: app.controller('myCtrl', function($scope, $location) { $scope.my ...

  9. Vue el与data的两种写法 && Object.defineProperty方法

    1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8" /> 5 & ...

随机推荐

  1. KVM和QEMU的关系(转载)

    From:http://blog.sina.com.cn/s/blog_605f5b4f0102uyjv.html KVM是一种基于CPU硬件辅助的全虚拟化技术,没有CPU硬件虚拟化的支持,KVM无法 ...

  2. django模板加载静态资源

    1. 目录结构 /mysite/setting.py部分配置: # Django settings for mysite project. import os.path TEMPLATE_DIRS = ...

  3. ASIHTTPRequest数据压缩

    本文转载至  http://blog.csdn.net/zhuoyuetec/article/details/18216439 IOSASIHttprequestsetShouldCompressRe ...

  4. Visual Studion 2013 HTML 如何打开设计图

    Visual Studion 2013 HTML 没有设计视图? 在解决方案中对要打开的HTML文件 右键-->打开方式-->HTML(Web窗体)编辑器 原地址>>:http ...

  5. 洛谷P2661 信息传递==coedevs4511 信息传递 NOIP2015 day1 T2

    P2661 信息传递 题目描述 有n个同学(编号为1到n)正在玩一个信息传递的游戏.在游戏里每人都有一个固定的信息传递对象,其中,编号为i的同学的信息传递对象是编号为Ti同学. 游戏开始时,每人都只知 ...

  6. 【BZOJ3993】[SDOI2015]星际战争 二分+最大流

    [BZOJ3993][SDOI2015]星际战争 Description 3333年,在银河系的某星球上,X军团和Y军团正在激烈地作战.在战斗的某一阶段,Y军团一共派遣了N个巨型机器人进攻X军团的阵地 ...

  7. lua 元表是个啥?

    function readOnly(t) local proxy = {} local mt = { __index = t, __newindex = function(t,k,v) error(& ...

  8. iptables的例子1

      练习1:实现主机防火墙   设置主机防火墙策略为DROP: iptables -t filter -P INPUT DROP iptables -t filter -P OUTPUT DROP i ...

  9. Apache转发规则的一点注意

    RewriteRule ^studio/$ book.php?mod=studio 这种目录转发, 正常情况下是没问题的. 但是当根目录下存在一个 studio 目录时, apache就不会转发URL ...

  10. 【python】-- try except (异常捕获)、断言

    try except (异常捕获) 当程序出错了,但是我们又不想让用户看到这个错误,而且我在写程序的时候已经预料到了它可以出现这样的错误,出现这样的错误代表着什么,我们可以提前捕获这些个错误 1.异常 ...