这个是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. UFLDL深度学习笔记 (三)无监督特征学习

    UFLDL深度学习笔记 (三)无监督特征学习 1. 主题思路 "UFLDL 无监督特征学习"本节全称为自我学习与无监督特征学习,和前一节softmax回归很类似,所以本篇笔记会比较 ...

  2. yii2.0 console执行php守护进程

    //该方法只需执行一次public function actionIndex(){ $pid =pcntl_fork();//在当前进程中生成一个新的子进程 //$pid会有三种形式 $pid==-1 ...

  3. [原创]使用vscode+es6写nodejs服务端调试配置

    前端的小伙伴们在babel等的加持下,已经可以愉快的使用es6来写代码了. 然后对于服务端的nodejs就有点坑爹了,虽然原生支持了es6,但是只是部分支持,一些不支持的特性(比如module)使用了 ...

  4. 小程序JSON数组操作

  5. Java语言实现简单FTP软件------>连接管理模块的实现:主机与服务器之间的连接与关闭操作(八)

    (1)FTP连接 运行FTP客户端后,首先是连接FTP服务器,需要输入FTP服务器的IP地址及用户名.密码以及端口号后点击连接按钮开始连接FTP服务器,连接流程图如下图所示. 点击"连接&q ...

  6. Linux中的man

    1.查看命令的帮助信息 man mkdir 2.查看服务配置文件的帮助信息 man services 说明: a.如果没有man通过yum install man安装 b.如果命令和服务同名了,那就指 ...

  7. G20峰会将会给数字货币带来哪些影响?

    G20峰会对于全球经济有着举足轻重的影响,其成员人口占全球的2/3,国土面积占全球的60%,国内生产总值占全球的90%,贸易额占全球的75%……作为国际经济合作的主要平台,G20在引领和推动国际经济合 ...

  8. statu 设置

    DATA: itab TYPE TABLE OF sy-ucomm. APPEND 'DELE' TO itab. APPEND 'PICK' TO itab. SET PF-STATUS 'STA3 ...

  9. JSON JsonArray和JsonObject学习资料

    资料地址: http://www.json.org/json-zh.html

  10. 基于事件驱动的前端通信框架(封装socket.io)

    socket.io的使用可以很轻松的实现websockets,兼容所有浏览器,提供实时的用户体验,并且为程序员提供客户端与服务端一致的编程体验.但是在使用socket.io的过程中,由于业务需求需要同 ...