当前位置: 首页 > 编程笔记 >

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

郑俊弼
2023-03-14
本文向大家介绍js实现点击图片改变页面背景图的方法,包括了js实现点击图片改变页面背景图的方法的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了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程序设计有所帮助。

 类似资料:
  • 本文向大家介绍JavaScript实现点击图片换背景,包括了JavaScript实现点击图片换背景的使用技巧和注意事项,需要的朋友参考一下 JS制作网页–点击图片换背景,供大家参考,具体内容如下 网页中有四个图片,点击不同的图片,更换相对应的背景。 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持呐喊教程。

  • 本文向大家介绍js实现点击切换checkbox背景图片的简单实例,包括了js实现点击切换checkbox背景图片的简单实例的使用技巧和注意事项,需要的朋友参考一下 在制作网页的过程中,经常需要实现点击切换背景图片的效果,本文关注的是表单中checkbox背景图片切换的实现。如图,在输入用户名和密码后,用户需要选择是否记住密码 图片背景为白色表示未勾选状态 ,背景为蓝色表示勾选状态 。 HTML源码

  • 本文向大家介绍js鼠标点击图片实现随机变换图片的方法,包括了js鼠标点击图片实现随机变换图片的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js鼠标点击图片实现随机变换图片的方法。分享给大家供大家参考。具体实现方法如下: 希望本文所述对大家的javascript程序设计有所帮助。

  • 本文向大家介绍js实现背景图片感应鼠标变化的方法,包括了js实现背景图片感应鼠标变化的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js实现背景图片感应鼠标变化的方法。分享给大家供大家参考。具体分析如下: 鼠标点击后背景图片变化,点击另外一个菜单项前面的会自动恢复背景,其实这个如果单纯使用CSS是没办法做的,我们还要使用JS来判断鼠标状态,代码如下: 希望本文所述对大家的javasc

  • 本文向大家介绍JS实现让网页背景图片斜向移动的方法,包括了JS实现让网页背景图片斜向移动的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了JS实现让网页背景图片斜向移动的方法。分享给大家供大家参考。具体实现方法如下: 希望本文所述对大家的javascript程序设计有所帮助。

  • 本文向大家介绍js实现单击图片放大图片的方法,包括了js实现单击图片放大图片的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js实现单击图片放大图片的方法。分享给大家供大家参考。具体实现方法如下: 希望本文所述对大家的javascript程序设计有所帮助。