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 相关文章推荐
js资料prototype 属性
Mar 13 Javascript
关于 byval 与 byref 的区别分析总结
Oct 08 Javascript
JavaScript创建命名空间(namespace)的最简实现
Dec 11 Javascript
复制Input内容的js代码_支持所有浏览器,修正了Firefox3.5以上的问题
Jun 21 Javascript
jQuery中:contains选择器用法实例
Dec 30 Javascript
JavaScript实现获取dom中class的方法
Feb 09 Javascript
在JavaScript中使用对数Math.log()方法的教程
Jun 15 Javascript
JavaScript获取对象在页面中位置坐标的方法
Feb 03 Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
Aug 01 Javascript
Bootstrap的popover(弹出框)在append后弹不出(失效)
Feb 27 Javascript
js实现下一页页码效果
Mar 07 Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 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
基于mysql的论坛(5)
2006/10/09 PHP
PHP数组遍历的几种常见方式总结
2019/02/15 PHP
Extjs实现进度条的两种便捷方式
2013/09/26 Javascript
JavaScript 数组详解
2013/10/10 Javascript
node.js中的fs.readlinkSync方法使用说明
2014/12/17 Javascript
jQuery中click事件用法实例
2014/12/26 Javascript
JavaScript数组常用方法
2015/03/02 Javascript
javascript实现英文首字母大写
2015/04/23 Javascript
javascript中mouseover、mouseout使用详解
2015/07/19 Javascript
JS弹出层遮罩,隐藏背景页面滚动条细节优化分析
2016/04/29 Javascript
真正好用的js验证上传文件大小的简单方法
2016/10/27 Javascript
使用Xcache缓存器加速PHP网站的配置方法
2017/04/22 Javascript
Node做中转服务器转发接口
2017/10/18 Javascript
Vue 换肤的示例实践
2018/01/23 Javascript
vue如何判断dom的class
2018/04/26 Javascript
发布一款npm包帮助理解npm的使用
2019/01/03 Javascript
JavaScript实现的开关灯泡点击切换特效示例
2019/07/08 Javascript
js实现简单的打印表格
2020/01/15 Javascript
vue从零实现一个消息通知组件的方法详解
2020/03/16 Javascript
[02:40]DOTA2超级联赛专访430 从小就爱玩对抗性游戏
2013/06/18 DOTA
python遍历文件夹并删除特定格式文件的示例
2014/03/05 Python
Python连接Redis的基本配置方法
2018/09/13 Python
pyttsx3实现中文文字转语音的方法
2018/12/24 Python
python实现弹跳小球
2019/05/13 Python
Python模块常用四种安装方式
2020/10/20 Python
用CSS3将你的设计带入下个高度
2009/08/08 HTML / CSS
德国亚洲食品网上商店:asiafoodland.de
2019/12/28 全球购物
Ajax和javascript的区别
2013/07/20 面试题
通信研究生自荐信
2014/02/01 职场文书
材料专业毕业生求职信
2014/02/26 职场文书
孝敬父母的活动方案
2014/08/31 职场文书
2014教师党员自我评议总结
2014/09/19 职场文书
2014年移动公司工作总结
2014/12/08 职场文书
导游词之张家口
2019/12/13 职场文书
Nginx虚拟主机的搭建的实现步骤
2022/01/18 Servers
JS实现简单九宫格抽奖
2022/06/28 Javascript