t实现页面自适应reset可见区域高度

王朝学院·作者佚名  2016-05-22
窄屏简体版  字體: 小  |  中  |  大  |  超大  

javascript实现页面自适应reset可见区域高度1、该功能只适用于需要页面自动撑满或缩小到可见区域,并且只对单个主体改变高度的需求。

var ResetControl = function (pTask) { var _task = pTask || [], _isLock = false, bindEvent = function(){ var me = this; $(window).bind('resize.reset', function (event) { fire.call(me); if (_task.length === 0) { $(window).unbind('resize.reset', arguments.callee); } }); }, fire = function () { //当前页面可见高度 var _iHeight = Math.min(window.innerHeight, document.documentElement.clientHeight), //页面整体高度 _wHeight = Math.max(document.documentElement.clientHeight, document.documentElement.scrollHeight, document.body.clientHeight, document.body.scrollHeight), //页面整体实际高度 _bHeight = document.body.offsetHeight, _resetHeight = 0; if (_iHeight > _bHeight) { //当前页面可见高度 - 页面整体实际高度 _resetHeight = _iHeight - _bHeight; } else { //当前页面可见高度 - 页面整体高度 _resetHeight = _iHeight - _wHeight; } for(var i = 0,l = _task.length;i < l;i++){ var _h = _task[i][0].offsetHeight; _h = (_h + _resetHeight) < 200 ? 200 : (_h + _resetHeight); _task[i].CSS("height", _h + "px"); } } this.push = function(pItem){ _task.push(pItem); } this.init = function(){ setTimeout(function () { fire(); bindEvent(); }, 100); } }

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航