js實(shí)現(xiàn)背景圖自適應(yīng)窗口大小
更新時(shí)間：2017年01月10日 09:56:59 作者：狗子的狗糧
本文分享了背景圖自適應(yīng)窗口大小的實(shí)例代碼，具有一定的參考作用。下面跟著小編一起來看下吧
話不多說，請(qǐng)看代碼
<script type="text/javascript">
window.onresize = window.onload = function()
{
var w,bgImg;
if(!!(window.attachEvent && !window.opera)) {
w = document.documentElement.clientWidth;
} else {
w = window.innerWidth;
}if(w>1650){
document.getElementById ('msg').value ='窗口大?。? + 'width:' + w;
bgImg = document.getElementById('bg').getElementsByTagName('img')[0];
bgImg.width = (w - 5);
}else{
document.getElementById ('msg').value ='窗口大小：' + 'width:' + w;
bgImg = document.getElementById('bg').getElementsByTagName('img')[0];
bgImg.width = 1650;
}
}
</script>
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時(shí)也希望多多支持腳本之家！
您可能感興趣的文章:
- 使用js操作css實(shí)現(xiàn)js改變背景圖片示例
- 純js實(shí)現(xiàn)背景圖片切換效果代碼
- javascript設(shè)置頁面背景色及背景圖片的方法
- js實(shí)現(xiàn)網(wǎng)頁隨機(jī)切換背景圖片的方法
- js實(shí)現(xiàn)點(diǎn)擊圖片改變頁面背景圖的方法
- js實(shí)現(xiàn)按鈕加背景圖片常用方法
- JavaScript實(shí)現(xiàn)更換背景圖片
- 解決vuejs項(xiàng)目里css引用背景圖片不能顯示的問題
- PNGHandler-借助JS讓PNG圖在IE下實(shí)現(xiàn)透明（包括背景圖）
- 用chart.js添加動(dòng)態(tài)背景圖
相關(guān)文章
這篇文章主要介紹了JS中移除非數(shù)字最多保留一位小數(shù)的實(shí)現(xiàn)代碼，文章給大家提到了js處理數(shù)字保留2位小數(shù),強(qiáng)制保留2位小數(shù)不夠補(bǔ)上.00的完整代碼，感興趣的朋友一起看看吧2018-05-05
詳解js對(duì)象中屬性的兩種類型之?dāng)?shù)據(jù)屬性和訪問器屬性
在理解vue底層響應(yīng)式原理時(shí)，了解到，原來對(duì)象中的屬性，不單單從表面看起來那么簡單是key:value形式，而是還有隱藏的內(nèi)部特性，其中對(duì)象內(nèi)的屬性分為兩種類型的屬性：數(shù)據(jù)屬性和訪問器屬性，本文將給大家詳細(xì)介紹一下數(shù)據(jù)屬性和訪問器屬性,需要的朋友可以參考下2023-05-05
移動(dòng)端使用localStorage緩存Js和css文的方法(web開發(fā))
這篇文章主要介紹了web移動(dòng)端使用localStorage緩存Js和css文的方法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-09-09
TypeScript環(huán)境搭建的實(shí)現(xiàn)步驟
本文主要介紹了TypeScript環(huán)境搭建的實(shí)現(xiàn)步驟，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-01-01
這篇文章介紹了JS在Canvas元素內(nèi)繪制鐘表的方法，文中通過示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-01-01
JavaScript實(shí)現(xiàn)簡易聊天對(duì)話框(加滾動(dòng)條)
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)簡易聊天對(duì)話框，附加滾動(dòng)條功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-02-02
這篇文章主要教大家如何快速簡單的實(shí)現(xiàn)js計(jì)算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-08-08
JavaScript作用域深度剖析之動(dòng)態(tài)作用域
這篇文章主要為大家介紹了?JavaScript作用域?qū)W習(xí)之動(dòng)態(tài)作用域深度剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05
通過學(xué)習(xí)bootstrop導(dǎo)航條學(xué)會(huì)修改bootstrop顏色基調(diào)
這篇文章主要介紹了通過學(xué)習(xí)bootstrop導(dǎo)航條學(xué)會(huì)修改bootstrop顏色基調(diào),需要的朋友可以參考下2017-06-06
html的DOM中Event對(duì)象onabort事件用法實(shí)例
這篇文章主要介紹了html的DOM中Event對(duì)象onabort事件用法,實(shí)例分析了onabort事件的適用范圍與對(duì)應(yīng)的javascript使用技巧,需要的朋友可以參考下2015-01-01