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 和 CSS 实现脚注(Footnote)效果
Sep 09 Javascript
使用js判断数组中是否包含某一元素(类似于php中的in_array())
Dec 12 Javascript
javascript 通用loading动画效果实例代码
Jan 14 Javascript
JQuery以JSON方式提交数据到服务端示例代码
May 05 Javascript
借助FileReader实现将文件编码为Base64后通过AJAX上传
Dec 24 Javascript
JavaScript统计字符串中每个字符出现次数完整实例
Jan 28 Javascript
Bootstrap简单表单显示学习笔记
Nov 15 Javascript
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
Vue两个版本的区别和使用方法(更深层次了解)
Feb 16 Javascript
vue实践---vue不依赖外部资源实现简单多语操作
Sep 21 Javascript
vue 实现基础组件的自动化全局注册
Dec 25 Vue.js
关于React Native 无法链接模拟器的问题
Jun 21 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中读写文件实现代码
2011/10/20 PHP
深入php 正则表达式的学习探讨
2013/06/06 PHP
PHP获取一年中每个星期的开始和结束日期的方法
2015/02/12 PHP
php htmlentities()函数的定义和用法
2016/05/13 PHP
php lcg_value与mt_rand生成0~1随机小数的效果对比分析
2017/04/05 PHP
基于PHP-FPM进程池探秘
2017/10/17 PHP
jsTree 基于JQuery的排序节点 Bug
2011/07/26 Javascript
javascript是怎么继承的介绍
2012/01/05 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
JavaScript中的原始值和复杂值
2016/01/07 Javascript
Bootstrap导航简单实现代码
2017/03/06 Javascript
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
2017/07/08 jQuery
详解ES6之async+await 同步/异步方案
2017/09/19 Javascript
详解Node.js模板引擎Jade入门
2018/01/19 Javascript
vue移动端弹框组件的实例
2018/09/25 Javascript
微信小程序如何调用新闻接口实现列表循环
2019/07/02 Javascript
Net微信网页开发 使用微信JS-SDK获取当前地理位置过程详解
2019/08/26 Javascript
NodeJs crypto加密制作token的实现代码
2019/11/15 NodeJs
浅谈Vue3.0新版API之composition-api入坑指南
2020/04/30 Javascript
ES6函数和数组用法实例分析
2020/05/23 Javascript
antd Select下拉菜单动态添加option里的内容操作
2020/11/02 Javascript
python中input()与raw_input()的区别分析
2016/02/27 Python
Flask数据库迁移简单介绍
2017/10/24 Python
python处理csv中的空值方法
2018/06/22 Python
Python 中的lambda函数介绍
2018/10/10 Python
Python中的 is 和 == 以及字符串驻留机制详解
2019/06/28 Python
python 使用cx-freeze打包程序的实现
2020/03/14 Python
Python 执行矩阵与线性代数运算
2020/08/01 Python
马云的职业生涯规划之路
2014/01/01 职场文书
趣味活动策划方案
2014/02/08 职场文书
《去年的树》教学反思
2014/04/11 职场文书
大学生违纪检讨书300字
2014/10/25 职场文书
2014财务年终工作总结
2014/12/08 职场文书
企业安全生产规章制度
2015/08/06 职场文书
导游词之西安骊山
2019/12/03 职场文书
不负正版帝国之名 《重返帝国》引领SLG手游制作新的标杆
2022/04/07 其他游戏