js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法


Posted in Javascript onAugust 11, 2015

本文实例讲述了js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法。分享给大家供大家参考。具体如下:

//控制logo的显示位置 Begin
window.addEventListener("resize", function () {
  // 得到屏幕尺寸 (内部/外部宽度,内部/外部高度)
  changeLogoPosition();
}, false);
changeLogoPosition();
function changeLogoPosition() {
  var contentHeight = $("#main_content_div").css("height");
  var logoHeight = $("#third_party_logo").css("height");
  contentHeight = parseInt(contentHeight.replace('px', ''));
  logoHeight = parseInt(logoHeight.replace('px', ''));
  //alert('屏幕高度:'+document.body.scrollHeight+' 内容高度:'+contentHeight+' logo高度:'+logoHeight);
  if (document.body.scrollHeight - contentHeight > logoHeight) {
    document.getElementById('third_party_logo').style.position = 'absolute';
  } else {
    document.getElementById('third_party_logo').style.position = '';
  }
}
//控制logo的显示位置 End

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jquery获取input表单值的代码
Apr 19 Javascript
jquery操作HTML5 的data-*的用法实例分享
Aug 17 Javascript
jquery搜索框效果实现方法
Jan 16 Javascript
jQuery实现当前页面标签高亮显示的方法
Mar 10 Javascript
jQuery实现hover合成事件的方法
Aug 06 Javascript
js日期插件dateHelp获取本月、三个月、今年的日期
Mar 07 Javascript
js实现可输入可选择的select下拉框
Dec 21 Javascript
基于Javascript倒计时效果
Dec 22 Javascript
详解AngularJS用Interceptors来统一处理HTTP请求和响应
Jun 08 Javascript
JavaScript数据结构之双向链表定义与使用方法示例
Oct 27 Javascript
mpvue小程序循环动画开启暂停的实现方法
May 15 Javascript
浅谈layui 绑定form submit提交表单的注意事项
Oct 25 Javascript
js模仿php中strtotime()与date()函数实现方法
Aug 11 #Javascript
JavaScript SHA512&SHA256加密算法详解
Aug 11 #Javascript
js中 javascript:void(0) 用法详解
Aug 11 #Javascript
高性能JavaScript 重排与重绘(2)
Aug 11 #Javascript
tuzhu_req.js 实现仿百度图片首页效果
Aug 11 #Javascript
省市区三级联动下拉框菜单javascript版
Aug 11 #Javascript
高性能JavaScript DOM编程(1)
Aug 11 #Javascript
You might like
在mysql数据库原有字段后增加新内容
2009/11/26 PHP
Laravel 5 框架入门(二)构建 Pages 的管理功能
2015/04/09 PHP
Yii2.0使用阿里云OSS的SDK上传图片、下载、删除图片示例
2017/09/20 PHP
javascript面向对象的方式实现的弹出层效果代码
2010/01/28 Javascript
基于jQuery的左右滚动实现代码
2010/12/03 Javascript
js constructor的实际作用分析
2011/11/15 Javascript
jQuery 全选/反选以及单击行改变背景色实例
2013/07/02 Javascript
js定时调用方法成功后并停止调用示例
2014/04/08 Javascript
jQuery里filter()函数与find()函数用法分析
2015/06/24 Javascript
实例详解AngularJS实现无限级联动菜单
2016/01/15 Javascript
Bootstrap模态对话框的简单使用
2016/04/29 Javascript
模板视图和AngularJS之间冲突的解决方法
2016/11/22 Javascript
详解如何将angular-ui的图片轮播组件封装成一个指令
2017/05/09 Javascript
layui前段框架日期控件使用方法详解
2017/05/19 Javascript
使用vue-cli导入Element UI组件的方法
2018/05/16 Javascript
layui select获取自定义属性方法
2018/08/15 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
VUEX 数据持久化,刷新后重新获取的例子
2019/11/12 Javascript
js 使用ajax设置和获取自定义header信息的方法小结
2020/03/12 Javascript
vue 验证两次输入的密码是否一致的方法示例
2020/09/29 Javascript
如何手动实现一个 JavaScript 模块执行器
2020/10/16 Javascript
Vue $attrs & inheritAttr实现button禁用效果案例
2020/12/07 Vue.js
python实现通过shelve修改对象实例
2014/09/26 Python
python使用PythonMagick将jpg图片转换成ico图片的方法
2015/03/26 Python
python下载文件时显示下载进度的方法
2015/04/02 Python
详解python函数传参是传值还是传引用
2018/01/16 Python
python3读取csv和xlsx文件的实例
2018/06/22 Python
python try 异常处理(史上最全)
2019/03/07 Python
详解Django项目中模板标签及模板的继承与引用(网站中快速布置广告)
2019/03/27 Python
python异步编程 使用yield from过程解析
2019/09/25 Python
Python 实现try重新执行
2019/12/21 Python
蛋白质世界:Protein World
2017/11/23 全球购物
文明演讲稿范文
2014/05/12 职场文书
英语系毕业生求职信
2014/07/13 职场文书
2015应届毕业生自荐信范文
2015/03/05 职场文书
2015年医院工作总结范文
2015/04/09 职场文书