JS之鼠标改变img
代码用途:
通过点击图片,来改变图片内容
代码:
<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('im')
if (element.src.match("2"))
{
element.src="./1.jpg";
}
else
{
element.src="./2.jpg";
}
}
</script> <img id="im" onclick="changeImage()" src="./2.jpg"> <p>君莫笑是冠军~~</p> </body>
</html>
效果图:
1.开始的时候,图片是个这样子的~
2.点击图片后,图片变成这样的啦~
JS之鼠标改变img的更多相关文章
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- Magnifier.js - 支持鼠标滚轮缩放的图片放大镜效果
Magnifier.js 是一个 JavaScript 库,能够帮助你在图像上实现放大镜效果,支持使用鼠标滚轮放大/缩小功能.放大的图像可以显示在镜头本身或它的外部容器中.Magnifier.js 使 ...
- js获取select改变事件
js获取select改变事件onchage前的值 和 onclick事件 <select id="wupin_id" name="wupin_id" on ...
- js实现鼠标的滑动
js实现鼠标的滑动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
- js获得鼠标的位置
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js中鼠标滚轮事件详解
js中鼠标滚轮事件详解 (以下内容部分内容参考了http://adomas.org/javascript-mouse-wheel/ ) 之前js 仿Photoshop鼠标滚轮控制输入框取值中已使用 ...
- JS判断鼠标向上滚动还是向下滚动
js如何判断滚轮的上下滚动,我们应该都见到过这种效果,用鼠标滚轮实现某个表单内的数字向上滚动就增加,向下滚动就减少的操作,这种效果是通过js对鼠标滚轮的事件监听来实现的.今天简单的研究了一下如何使用j ...
- JS 判断鼠标滚轮的上下滚动
JS 判断鼠标滚轮的上下滚动 <script type="text/javascript"> var scrollFunc = function (e) { e = ...
- JS Event 鼠标拖拽事件
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...
随机推荐
- 回收站(recyclebin)及回滚
1. alter table table_name enable row movement; flashback table table_name to timestamp to_timestam ...
- PAT 1035 Password
1035 Password (20 分) To prepare for PAT, the judge sometimes has to generate random passwords for ...
- Hadoop--之RPC开发
Hadoop--之RPC开发 介绍: 百度百科: RPC(Remote Procedure Call)—远程过程调用,它是一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议.R ...
- Apache+Tomcat+mod_jk配置教程
0.说明 首先我们要弄明白mod_jk的作用是反向代理,而其实使用httpd.conf中的<VirtualHost>标签就可以实现反向代理,为什么还要多搞个mod_jk那么麻烦做反向代理. ...
- rexec/rlogin/rsh介绍
服务 是否需要密码 是否明文 功能 端口 rexec 是 是 远程执行命令 512 rlogin 是 是 远程登录得到shell 513 rsh 是 是 可远程执行命令,也可远程登录得到shell 5 ...
- JSP调试技巧
我先谈谈: 我的经验就是多装几个服务器,这个查不出错误,用另一个,这个方法很好用. ---------------------------------------------------------- ...
- 运行网站项目时,有时出现Bad Request,该怎么解决?
有时运行网站项目时,出现Bad Request问题
- zabbix3.4.7触发器表达式详解
zabbix触发器表达式详解 概述:触发器中的表达式使用很灵活,我们可以创建一个复杂的逻辑测试监控,触发器表达式形式如下: {<server>:<key>.<functi ...
- laravel基于Bootstrap的成功和失败的提示信息和验证提示信息
message.blade.php <!-- 成功提示框 --> @if(Session::has("success")) <div class="al ...
- [转载]mysqlcreate新建用户host使用%,本地无法连接原因及解决方法
转载自 http://www.2cto.com/database/201307/225781.html mysql,因为root权限过高,所以新建一用户appadmin,权限仅为要用到的数据库.创建语 ...