欧美国产另类久热|951超碰伊人久久|伊人影视久久久久|色婷婷亚洲小电影|色东京热69XX|婷婷玖玖深爱网|加勒比东京热网站|无码A级毛片在线观看|一级a毛一级a看|中文字幕人妻欧美

js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)切換背景圖片的方法
來(lái)源:易賢網(wǎng) 閱讀:1117 次 日期:2014-11-02 10:05:15
溫馨提示:易賢網(wǎng)小編為您整理了“js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)切換背景圖片的方法”,方便廣大網(wǎng)友查閱!

易賢網(wǎng)網(wǎng)校上線了!

>>>點(diǎn)擊進(jìn)入<<<

網(wǎng)校開(kāi)發(fā)及擁有的課件范圍涉及公務(wù)員、財(cái)會(huì)類、外語(yǔ)類、外貿(mào)類、學(xué)歷類、

職業(yè)資格類、計(jì)算機(jī)類、建筑工程類、等9大類考試的在線網(wǎng)絡(luò)培訓(xùn)輔導(dǎo)。

本文實(shí)例講述了js實(shí)現(xiàn)網(wǎng)頁(yè)隨機(jī)切換背景圖片的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:

首先要準(zhǔn)備一些圖像,圖像的大?。o(wú)論是尺寸大小還是數(shù)據(jù)大小)要控制好,如果太大,會(huì)使用戶等不及查看全圖就跳出了,如果太小,又會(huì)影響頁(yè)面質(zhì)量

在script中將這些圖像編為一個(gè)數(shù)組,便于調(diào)用。數(shù)組的長(zhǎng)度當(dāng)然就是圖像的數(shù)量。

代碼如下:

var bodyBgs = []; //創(chuàng)建一個(gè)數(shù)組變量來(lái)存儲(chǔ)背景圖片的路徑

bodyBgs[0] = "images/01.jpg";

bodyBgs[1] = "images/02.jpg";

bodyBgs[2] = "images/03.jpg";

bodyBgs[3] = "images/04.jpg";

bodyBgs[4] = "images/05.jpg";

因?yàn)樯厦嬗玫搅?個(gè)圖像,所以在這里需要產(chǎn)生一個(gè)0到4的隨機(jī)數(shù)。如果數(shù)組長(zhǎng)度不一樣,修改下面代碼中的乘數(shù)就可以。

代碼如下:

var randomBgIndex = Math.round( Math.random() * 4 );

核心的程序就是這些。盡管很簡(jiǎn)單,卻是一種小小的思路,若以此為基礎(chǔ),通過(guò)加工可以做出一些擴(kuò)展功能。比如:主題切換以及其它的隨機(jī)呈現(xiàn)等等。下面是完整的JS代碼。

代碼如下:

<script type="text/javascript">

//<!CDATA[

var bodyBgs = [];

bodyBgs[0] = "images/01.jpg";

bodyBgs[1] = "images/02.jpg";

bodyBgs[2] = "images/03.jpg";

bodyBgs[3] = "images/04.jpg";

bodyBgs[4] = "images/05.jpg";

var randomBgIndex = Math.round( Math.random() * 4 );

//輸出隨機(jī)的背景圖

document.write('<style>body{background:url(' + bodyBgs[randomBgIndex] + ') no-repeat 50% 0}</style>');

//]]>

</script>

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

更多信息請(qǐng)查看IT技術(shù)專欄

更多信息請(qǐng)查看網(wǎng)絡(luò)編程
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門公布的正式信息和咨詢?yōu)闇?zhǔn)!
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 新媒體/短視頻平臺(tái) | 手機(jī)站點(diǎn)

版權(quán)所有:易賢網(wǎng)