快捷導(dǎo)航

js實(shí)現(xiàn)點(diǎn)擊圖片改變頁(yè)面背景圖的方法

更新時(shí)間：2015年02月28日 09:09:31 作者：代碼家園

這篇文章主要介紹了js實(shí)現(xiàn)點(diǎn)擊圖片改變頁(yè)面背景圖的方法,實(shí)例分析了javascript操作css與圖片的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)點(diǎn)擊圖片改變頁(yè)面背景圖的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：

<html>

<head>

<title>點(diǎn)擊圖片即改變頁(yè)面的背景圖片</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>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

js+html+css實(shí)現(xiàn)手動(dòng)輪播和自動(dòng)輪播
這篇文章主要為大家詳細(xì)介紹了js+html+css實(shí)現(xiàn)手動(dòng)輪播和自動(dòng)輪播效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-12-12
js獲取事件源及觸發(fā)該事件的對(duì)象
如何獲取事件源及觸發(fā)該事件的對(duì)象，方法有很多，js中可以通過(guò)event來(lái)實(shí)現(xiàn)，下面有個(gè)不錯(cuò)的示例，感興趣的朋友可以參考下
2013-10-10
js如何判斷輸入字符串長(zhǎng)度
這篇文章主要介紹了js判斷輸入字符串長(zhǎng)度，漢字算兩個(gè)字符，字母數(shù)字算一個(gè)，感興趣的小伙伴們可以參考一下
2015-12-12
老生常談js動(dòng)態(tài)添加事件--- 事件委托
下面小編就為大家?guī)?lái)一篇老生常談js動(dòng)態(tài)添加事件--- 事件委托。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
Javascript 學(xué)習(xí)筆記錯(cuò)誤處理
Javascript學(xué)習(xí)筆記:錯(cuò)誤處理.
2009-07-07
JS實(shí)現(xiàn)靈巧的下拉導(dǎo)航效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)靈巧的下拉導(dǎo)航效果代碼,通過(guò)自定義js插件腳本dropdown.js實(shí)現(xiàn)簡(jiǎn)單的下拉導(dǎo)航效果的功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-08-08
javascript中apply和call方法的作用及區(qū)別說(shuō)明
本篇文章主要是對(duì)javascript中apply和call方法的作用及區(qū)別進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-02-02
JS應(yīng)用正則表達(dá)式轉(zhuǎn)換大小寫(xiě)示例
這篇文章主要介紹了JS應(yīng)用正則表達(dá)式轉(zhuǎn)換大小寫(xiě)，以首字母大寫(xiě)，其它字母小寫(xiě)為例，喜歡的朋友可以參考下
2014-09-09
JSON+JavaScript處理JSON的簡(jiǎn)單例子
JSON+JavaScript處理JSON的簡(jiǎn)單例子，需要的朋友可以參考一下
2013-03-03
基于three.js實(shí)現(xiàn)的3D粒子動(dòng)效實(shí)例代碼
這篇文章主要給大家介紹了關(guān)于如何基于three.js實(shí)現(xiàn)的3D粒子動(dòng)效的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用three.js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04