编程 Javascript

js实现点击图片改变页面背景图的方法

Posted in Javascript onFebruary 28, 2015

本文实例讲述了js实现点击图片改变页面背景图的方法。分享给大家供大家参考。具体实现方法如下：

<html>

<head>

<title>点击图片即改变页面的背景图片</title>

</head>

<body bgcolor="#FFFFFF" leftmargin="0" marginwidth="0">

<script language="JavaScript1.2">

<!--

function tile(){

if (!document.all)

return

var source=event.srcElement

if (source.tagName=="IMG")

document.body.style.backgroundImage="url("+source.src+")"

}

function restore(){

document.body.style.backgroundImage=''

}

document.body.ondblclick=restore

-->

</script>

      </p>

      <p align="center"><span class="bgimages" onClick="tile();event.cancelBubble=true">

      <img src="/images/m01.jpg" height=65 width=96 border=2>

      <img src="/images/m02.jpg" height=65 width=96 border=2>

<br>

      <img src="/images/m03.jpg" height=65 width=96 border=2>

      <img src="/images/m04.jpg" height=65 width=96 border=2></span></p>

    </td>

  </tr>

</table>

</center>

</body>

</html>

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

js实现点击图片改变页面背景图的方法

- Author -

代码家园

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jquery 插件 web2.0分格的分页脚本，可用于ajax无刷新分页

Dec 25 Javascript

JavaScript实现两个Table固定表头根据页面大小自行调整

Jan 03 Javascript

JS+CSS实现淡入式焦点图片幻灯切换效果的方法

Feb 26 Javascript

如何解决ligerUI布局时Center中的Tab高度大小

Nov 24 Javascript

jQuery快速高效制作网页交互特效

Feb 24 Javascript

使用webpack打包koa2 框架app

Feb 02 Javascript

原生JS实现瀑布流插件

Feb 06 Javascript

Node 升级到最新稳定版的方法分享

May 17 Javascript

vue-cli 默认路由再子路由选中下的选中状态问题及解决代码

Sep 06 Javascript

解决vue自定义全局消息框组件问题

Nov 22 Javascript

原生js实现文件上传、下载、封装等实例方法

Jan 05 Javascript

使用javascript解析二维码的三种方式

Nov 11 Javascript

本人自用的global.js库源码分享

Feb 28 #Javascript

JS限制文本框只能输入数字和字母方法

Feb 28 #Javascript

javascript计时器详解

Feb 28 #Javascript

Lab.js初次使用笔记

Feb 28 #Javascript

js实现鼠标感应图片展示的方法

Feb 27 #Javascript

JQuery基础语法小结

Feb 27 #Javascript

JS实现网页背景颜色与select框中颜色同时变化的方法

Feb 27 #Javascript

You might like

php格式化时间戳显示友好的时间实现思路及代码

2014/10/23 PHP

PHP访问Google Search API的方法

2015/03/05 PHP

php中array_multisort对多维数组排序的方法

2020/06/21 PHP

详解yii2实现分库分表的方案与思路

2017/02/03 PHP

JavaScript null和undefined区别分析

2009/10/14 Javascript

js将long日期格式转换为标准日期格式实现思路

2013/04/07 Javascript

js弹出层包含flash 不能关闭隐藏的2种处理方法

2013/06/17 Javascript

jQuery中的$.ajax()方法应用

2014/05/06 Javascript

js获取input长度并根据页面宽度设置其大小及居中对齐

2014/08/22 Javascript

js中style.display=""无效的解决方法

2014/10/30 Javascript

JavaScript中的值类型转换介绍

2014/12/31 Javascript

jQuery使用post方法提交数据实例

2015/03/25 Javascript

页面内容排序插件jSort使用方法

2015/10/10 Javascript

AngularJs Understanding the Model Component

2016/09/02 Javascript

BootStrap表单验证实例代码

2017/01/13 Javascript

vue实现点击图片放大效果

2017/08/15 Javascript

AngularJS 表单验证手机号的实例(非必填)

2017/11/12 Javascript

babel的使用及安装配置教程

2018/02/22 Javascript

关于vue面试题汇总

2018/03/20 Javascript

express框架下使用session的方法

2019/07/31 Javascript

简单了解vue中的v-if和v-show的区别

2019/10/08 Javascript

[01:04:29]DOTA2-DPC中国联赛正赛 Phoenix vs XG BO3 第二场 1月31日

2021/03/11 DOTA

python脚本替换指定行实现步骤

2017/07/11 Python

python对列进行平移变换的方法(shift)

2019/01/10 Python

Python Selenium 之关闭窗口close与quit的方法

2019/02/13 Python

python爬取cnvd漏洞库信息的实例

2019/02/14 Python

解决pyecharts在jupyter notebook中使用报错问题

2020/04/23 Python

django xadmin action兼容自定义model权限教程

2020/03/30 Python

以色列的身体护理及家居香薰品牌：Sabon NYC

2018/02/23 全球购物

办公室秘书岗位职责范本

2014/02/11 职场文书

高中学生期末评语

2014/04/25 职场文书

2014年银行工作总结范文

2014/11/12 职场文书

学术会议领导致辞

2015/07/29 职场文书

《猴王出世》教学反思

2016/02/23 职场文书

2019升学宴主持词范本5篇

2019/10/09 职场文书

React forwardRef的使用方法及注意点

2021/06/13 Javascript