js实现背景图自适应窗口大小


Posted in Javascript onJanuary 10, 2017

话不多说,请看代码

<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>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
在JavaScript中,为什么要尽可能使用局部变量?
Apr 06 Javascript
JavaScript 判断用户输入的邮箱及手机格式是否正确
Dec 08 Javascript
JavaScript中创建对象和继承示例解读
Feb 12 Javascript
删除条目时弹出的确认对话框
Jun 05 Javascript
[原创]推荐10款最热门jQuery UI框架
Aug 19 Javascript
jQuery创建自定义的选择器用以选择高度大于100的超链接实例
Mar 18 Javascript
js生成随机数(指定范围)的实例代码
Jul 10 Javascript
解决Mac node版本升级失败的问题
May 16 Javascript
JS中call()和apply()的功能及用法实例分析
Jun 28 Javascript
Vue实现简单计算器案例
Feb 25 Javascript
JavaScript中break、continue和return的用法区别实例分析
Mar 02 Javascript
vue-admin-template配置快捷导航的代码(标签导航栏)
Sep 04 Javascript
微信JSAPI支付操作需要注意的细节
Jan 10 #Javascript
jQuery使用ajax方法解析返回的json数据功能示例
Jan 10 #Javascript
ajax实现动态下拉框示例
Jan 10 #Javascript
JavaScript三种绑定事件方式及相互之间的区别分析
Jan 10 #Javascript
详解使用Vue.Js结合Jquery Ajax加载数据的两种方式
Jan 10 #Javascript
JavaScript获取键盘按键的键码(参照表)
Jan 10 #Javascript
详解vue之页面缓存问题(基于2.0)
Jan 10 #Javascript
You might like
php4的session功能评述(三)
2006/10/09 PHP
windows下PHP APACHE MYSQ完整配置
2007/01/02 PHP
PHP+MySQL统计该库中每个表的记录数并按递减顺序排列的方法
2016/02/15 PHP
将PHP的session数据存储到数据库中的代码实例
2016/06/24 PHP
PHP实现创建微信自定义菜单的方法示例
2017/07/14 PHP
PHP 记录访客的浏览信息方法
2018/01/29 PHP
php 多个变量指向同一个引用($b = &amp;$a)用法分析
2019/11/13 PHP
浅析PHP中的 inet_pton 网络函数
2019/12/16 PHP
另类调用flash无须激活的方法
2006/12/27 Javascript
Lazy Load 延迟加载图片的 jQuery 插件
2010/02/06 Javascript
纯JS实现的批量图片预览加载功能
2011/08/14 Javascript
js+css 实现遮罩居中弹出层(随浏览器窗口滚动条滚动)
2013/12/11 Javascript
20个实用的JavaScript技巧分享
2014/11/28 Javascript
JS上传图片前实现图片预览效果的方法
2015/03/02 Javascript
深入探究使JavaScript动画流畅的一些方法
2015/06/30 Javascript
原生JavaScript制作微博发布面板效果
2016/03/11 Javascript
JS 滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件
2016/10/10 Javascript
JavaScript仿微博输入框效果(案例分析)
2016/12/06 Javascript
利用node.js搭建简单web服务器的方法教程
2017/02/20 Javascript
解决父组件将子组件作为弹窗调用只执行一次created的问题
2020/07/24 Javascript
使用Python进行稳定可靠的文件操作详解
2013/12/31 Python
Flask框架web开发之零基础入门
2018/12/10 Python
在win64上使用bypy进行百度网盘文件上传功能
2020/01/02 Python
python 插入日期数据到Oracle实例
2020/03/02 Python
解决pyecharts运行后产生的html文件用浏览器打开空白
2020/03/11 Python
python模拟斗地主发牌
2020/04/22 Python
Python 通过正则表达式快速获取电影的下载地址
2020/08/17 Python
python logging模块的使用
2020/09/07 Python
美国最好的保健品打折网店:Swanson
2017/08/04 全球购物
Charles&Keith美国官方网站:新加坡快时尚鞋类和配饰零售商
2019/11/27 全球购物
预备党员承诺书
2014/03/25 职场文书
2015年效能监察工作总结
2015/04/23 职场文书
公司捐书倡议书
2015/04/27 职场文书
车间班组长竞聘书
2015/09/15 职场文书
优秀共产党员主要事迹材料
2015/11/05 职场文书
导游词范文之颐和园/重庆/云台山
2019/09/10 职场文书