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 相关文章推荐
Add a Table to a Word Document
Jun 15 Javascript
jquery select(列表)的操作(取值/赋值)
Aug 06 Javascript
jquery实现图片切换代码
Oct 13 Javascript
深入理解jquery中的each用法
Dec 14 Javascript
bootstrap Table服务端处理分页(后台是.net)
Oct 19 Javascript
常用的 JS 排序算法 整理版
Apr 05 Javascript
vue 巧用过渡效果(小结)
Sep 22 Javascript
vue项目中在外部js文件中直接调用vue实例的方法比如说this
Apr 28 Javascript
Vue监听页面刷新和关闭功能
Jun 20 Javascript
vue 调用 RESTful风格接口操作
Aug 11 Javascript
JS实现炫酷轮播图
Nov 15 Javascript
vant-ui框架的一个bug(解决切换后onload不触发)
Nov 11 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
通过PHP current函数获取未知字符键名数组第一个元素的值
2013/06/24 PHP
Yii入门教程之Yii安装及hello world
2014/11/25 PHP
Zend Framework教程之Zend_Form组件实现表单提交并显示错误提示的方法
2016/03/21 PHP
Yii2 rbac权限控制之rule教程详解
2016/06/23 PHP
如何打开php的gd2库
2017/02/09 PHP
Laravel开启跨域请求的方法
2019/10/13 PHP
动态的改变IFrame的高度实现IFrame自动伸展适应高度
2012/12/28 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
2016/01/04 Javascript
使用javascript插入样式
2016/03/14 Javascript
基于javascript制作经典传统的拼图游戏
2016/03/22 Javascript
深入浅析JavaScript函数前面的加号和叹号
2016/07/09 Javascript
AngularJS表单和输入验证实例
2016/11/02 Javascript
Bootstrap实现提示框和弹出框效果
2017/01/11 Javascript
jQuery插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
2017/03/25 jQuery
基于jQuery中ajax的相关方法汇总(必看篇)
2017/11/08 jQuery
微信小程序框架wepy之动态控制类名
2018/09/14 Javascript
加快Vue项目的开发速度的方法
2018/12/12 Javascript
python中requests小技巧
2017/05/10 Python
python清除函数占用的内存方法
2018/06/25 Python
Python实现处理逆波兰表达式示例
2018/07/30 Python
python 重命名轴索引的方法
2018/11/10 Python
对python3 中方法各种参数和返回值详解
2018/12/15 Python
对python读取zip压缩文件里面的csv数据实例详解
2019/02/08 Python
详解Anconda环境下载python包的教程(图形界面+命令行+pycharm安装)
2019/11/11 Python
django框架中ajax的使用及避开CSRF 验证的方式详解
2019/12/11 Python
Python paramiko 模块浅谈与SSH主要功能模拟解析
2020/02/29 Python
使用CSS3实现圆角,阴影,透明
2014/12/23 HTML / CSS
基于CSS3制作立体效果导航菜单
2016/01/12 HTML / CSS
日本一家专门经营各种箱包的大型网站:Traveler Store
2016/08/03 全球购物
西班牙在线药店:DosFarma
2020/03/28 全球购物
财务会计实习报告体会
2013/12/20 职场文书
机关门卫的岗位职责
2014/04/29 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
2014年高中班主任工作总结
2014/11/08 职场文书
Java方法重载和方法重写的区别到底在哪?
2021/06/11 Java/Android