js鼠标点击图片实现随机变换图片的方法


Posted in Javascript onFebruary 16, 2015

本文实例讲述了js鼠标点击图片实现随机变换图片的方法。分享给大家供大家参考。具体实现方法如下:

<html>
<title>鼠标点击图片即可随机变换图片</title>
<body bgcolor="#fef4d9" OnLoad="swapPic()">
<center>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var rand1 = 0;
var useRand = 0;
images = new Array;
images[1] = new Image();
images[1].src = "images/m01.jpg";
images[2] = new Image();
images[2].src = "images/m02.jpg";
images[3] = new Image();
images[3].src = "images/m03.jpg";
images[4] = new Image();
images[4].src = "images/m04.jpg";
function swapPic() {
var imgnum = images.length - 1;
do {
var randnum = Math.random();
rand1 = Math.round((imgnum - 1) * randnum) + 1;
} while (rand1 == useRand);
useRand = rand1;
document.randimg.src = images[useRand].src;
}
// End -->
</script>
<a onClick="swapPic();">
<img name="randimg" src="images/m09.jpg">
</a>
<br>
<font face="Verdana" size="-2">click image to change
</center>
</body>
</html>

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

Javascript 相关文章推荐
js 鼠标拖动对象 可让任何div实现拖动效果
Nov 09 Javascript
JQuery自定义事件的应用 JQuery最佳实践
Aug 01 Javascript
关于二级域名下使用一级域名下的COOKIE的问题
Nov 07 Javascript
讨论html与javascript在浏览器中的加载顺序问题
Nov 27 Javascript
常见JS验证脚本汇总
Dec 01 Javascript
javascript表单控件实例讲解
Sep 13 Javascript
canvas实现十二星座星空图
Feb 14 Javascript
react native与webview通信的示例代码
Sep 25 Javascript
vue+node+webpack环境搭建教程
Nov 05 Javascript
three.js实现3D模型展示的示例代码
Dec 31 Javascript
vue-cli中使用高德地图的方法示例
Mar 28 Javascript
微信小程序实现手势滑动效果
Aug 26 Javascript
JavaScript简介
Feb 15 #Javascript
JavaScript的原型继承详解
Feb 15 #Javascript
javascript 闭包详解
Feb 15 #Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
Feb 15 #Javascript
浅析javascript中函数声明和函数表达式的区别
Feb 15 #Javascript
不同编码的页面表单数据乱码问题解决方法
Feb 15 #Javascript
浅谈javascript中this在事件中的应用
Feb 15 #Javascript
You might like
PHP数组内存耗用太多问题的解决方法
2010/04/05 PHP
深入PHP许愿墙模块功能分析
2013/06/25 PHP
php中time()与$_SERVER[REQUEST_TIME]用法区别
2014/11/19 PHP
php中socket通信机制实例详解
2015/01/03 PHP
php实现TCP端口检测的方法
2015/04/01 PHP
PHP随手笔记整理之PHP脚本和JAVA连接mysql数据库
2015/11/25 PHP
Yii2中简单的场景使用介绍
2017/06/02 PHP
使用composer 安装 laravel框架的方法图文详解
2019/08/02 PHP
php 函数中静态变量使用的问题实例分析
2020/03/05 PHP
js判断undefined变量类型使用typeof
2013/06/03 Javascript
jQuery学习笔记之jQuery.fn.init()的参数分析
2014/06/09 Javascript
js树插件zTree获取所有选中节点数据的方法
2015/01/28 Javascript
浅谈EasyUI中Treegrid节点的删除
2015/03/01 Javascript
JavaScript实现点击按钮切换网页背景色的方法
2015/10/17 Javascript
轮播图组件js代码
2016/08/08 Javascript
BootStrop前端框架入门教程详解
2016/12/25 Javascript
jQuery实现简单的下拉菜单导航功能示例
2017/12/07 jQuery
nodejs acl的用户权限管理详解
2018/03/14 NodeJs
微信小程序实现横向增长表格的方法
2018/07/24 Javascript
搭建基于express框架运行环境的方法步骤
2018/11/15 Javascript
微信小程序 简易计算器实现代码实例
2019/09/02 Javascript
原生js实现下拉框选择组件
2021/01/20 Javascript
用Python登录Gmail并发送Gmail邮件的教程
2015/04/17 Python
Python实现希尔排序算法的原理与用法实例分析
2017/11/23 Python
Python实现定时精度可调节的定时器
2018/04/15 Python
python调用摄像头显示图像的实例
2018/08/03 Python
Python对excel文档的操作方法详解
2018/12/10 Python
对python 读取线的shp文件实例详解
2018/12/22 Python
python如果快速判断数字奇数偶数
2019/11/13 Python
html特殊符号示例 html特殊字符编码对照表
2014/01/14 HTML / CSS
JoJo Maman Bébé爱尔兰官网:英国最受欢迎的精品母婴品牌
2020/12/20 全球购物
新加坡第一的杂货零售商:NTUC FairPrice
2020/12/05 全球购物
法院授权委托书格式
2014/09/28 职场文书
领导工作表现评语
2015/01/04 职场文书
高三英语教学计划
2015/01/23 职场文书
python 实现德洛内三角剖分的操作
2021/04/22 Python