快捷導(dǎo)航

jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法

更新時(shí)間：2015年07月03日 15:45:53 作者：不吃皮蛋

這篇文章主要介紹了jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法,涉及javascript隨機(jī)數(shù)及動(dòng)態(tài)設(shè)置css樣式的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下

本文實(shí)例講述了jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法。分享給大家供大家參考。具體如下：

這里把背景圖片按照1.jpg - 20.jpg放到目錄里，jQuery會(huì)隨機(jī)調(diào)用這些圖片作為背景

$(document).ready(function(){
  bgImageTotal=20;
  randomNumber = Math.round(Math.random()*(bgImageTotal-1))+1;
  imgPath=('/my/image/path/'+randomNumber+'.jpg');
  $('h1').css('background-image', ('url("'+imgPath+'")'));
});

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

您可能感興趣的文章:

相關(guān)文章

jQuery插件PageSlide實(shí)現(xiàn)左右側(cè)欄導(dǎo)航菜單
jQuery pageSlide 是一個(gè)可以讓網(wǎng)頁(yè)出現(xiàn)滾動(dòng)效果的jQuery插件，它可以控制一個(gè)隱藏頁(yè)面的顯示和關(guān)閉。具體來說，就是當(dāng)前頁(yè)占一個(gè)完整頁(yè)面，隱藏頁(yè)是看不到的，你設(shè)置一個(gè)控制的地方，點(diǎn)擊該控制時(shí)觸發(fā)事件，隱藏的頁(yè)面就滑出來，再次點(diǎn)擊隱藏頁(yè)面以外的地方，它就又關(guān)閉
2015-04-04
jQuery的實(shí)例及必知重要的jQuery選擇器詳解
下面小編就為大家?guī)硪黄猨Query的實(shí)例及必知重要的jQuery選擇器詳解。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-05-05
jQuery遍歷DOM元素與節(jié)點(diǎn)方法詳解
這篇文章主要介紹了jQuery遍歷DOM元素與節(jié)點(diǎn)方法,結(jié)合實(shí)例形似詳細(xì)分析了jQuery遍歷DOM父級(jí)節(jié)點(diǎn),子級(jí)節(jié)點(diǎn)及兄弟節(jié)點(diǎn)的相關(guān)技巧,需要的朋友可以參考下
2016-04-04
JQuery中節(jié)點(diǎn)遍歷方法實(shí)例
這篇文章主要介紹了JQuery中節(jié)點(diǎn)遍歷方法,實(shí)例分析了jQuery遍歷節(jié)點(diǎn)的技巧,需要的朋友可以參考下
2015-05-05
JS中批量給元素綁定事件過程中的相關(guān)問題使用閉包解決
解決元素批量綁定事件的時(shí)候，出現(xiàn)i=最后一個(gè)循環(huán)變量的值的方法有兩種：把這個(gè)循環(huán)變量保存起來，不要讓它的作用域在整個(gè)函數(shù)，而是在循環(huán)體內(nèi)
2013-04-04
jQuery添加新內(nèi)容的四個(gè)常用方法分析【append，prepend，after，before】
這篇文章主要介紹了jQuery添加新內(nèi)容的四個(gè)常用方法,結(jié)合實(shí)例形式分析了jQuery元素添加append，prepend，after，before四種方法的功能與相關(guān)使用技巧,需要的朋友可以參考下
2019-03-03
jQuery使用toggleClass方法動(dòng)態(tài)添加刪除Class樣式的方法
這篇文章主要介紹了jQuery使用toggleClass方法動(dòng)態(tài)添加刪除Class樣式的方法,實(shí)例分析了jQuery中toggleClass方法操作class樣式的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
jQuery選擇器全面總結(jié)
本篇文章主要是對(duì)jQuery選擇器進(jìn)行了全面的總結(jié)介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2014-01-01
jQuery窗口、文檔、網(wǎng)頁(yè)各種高度的精確理解
這篇文章主要幫助大家快速理解jQuery瀏覽器窗口、網(wǎng)頁(yè)文檔及可視窗口的各種高度,需要的朋友可以參考下
2014-07-07
Jquery中的$.each獲取各種返回類型數(shù)據(jù)的使用方法
each()方法能使DOM循環(huán)結(jié)構(gòu)簡(jiǎn)潔，不容易出錯(cuò)。each()函數(shù)封裝了十分強(qiáng)大的遍歷功能，使用也很方便，它可以遍歷一維數(shù)組、多維數(shù)組、DOM, JSON 等等，在javaScript開發(fā)過程中使用$each可以大大的減輕我們的工作量。
2015-05-05