body onload 控制窗口大小 html,如何实现在调整浏览器窗口大小时缩放的网页?
感谢所有的建议!看起来我必须做的丑陋的东西是必要的。以下工作(在我的机器上,无论如何)在IE和FireFox中。我稍后可以为CodeProject.com制作一篇文章; - )
这个javascript进入< head>部分:
var tmout = null;
var mustReload = false;
function Resizing()
{
if (tmout != null)
{
clearTimeout(tmout);
}
tmout = setTimeout(RefreshAll,300);
}
function Reload()
{
document.location.href = document.location.href;
}
//IE fires the window's onresize event when the client area
//expands or contracts, which causes an infinite loop.
//the way around this is a hidden div set to 100% of
//height and width, with a guard around the resize event
//handler to see if the _window_ size really changed
var windowHeight;
var windowWidth;
window.onresize = null;
window.onresize = function()
{
var backdropDiv = document.getElementById("divBackdrop");
if (windowHeight != backdropDiv.offsetHeight ||
windowWidth != backdropDiv.offsetWidth)
{
//if screen is shrinking, must reload to get correct sizes
if (windowHeight != backdropDiv.offsetHeight ||
windowWidth != backdropDiv.offsetWidth)
{
mustReload = true;
}
else
{
mustReload = mustReload || false;
}
windowHeight = backdropDiv.offsetHeight;
windowWidth = backdropDiv.offsetWidth;
Resizing();
}
}
< body>像这样开始:
style="width:100%; clear:both; height: 100%; margin: 0;
padding: 0; position:absolute; top:0px; left:0px;
visibility:hidden; z-index:0;">
DIV向左浮动以进行布局。我必须将高度和宽度设置为完全量(例如,99.99%,59.99%,39.99%)的百分比,以防止浮动包裹,可能是由于DIV上的边界。
最后,在内容部分之后,另一个javascript块来管理刷新:
var isWorking = false;
var currentEntity = ;
//try to detect a bad back-button usage;
//if the current entity id does not match the querystring
//parameter entityid=###
if (location.search != null && location.search.indexOf("&entityid=") > 0)
{
var urlId = location.search.substring(
location.search.indexOf("&entityid=")+10);
if (urlId.indexOf("&") > 0)
{
urlId = urlId.substring(0,urlId.indexOf("&"));
}
if (currentEntity != urlId)
{
mustReload = true;
}
}
//a friendly please wait... hidden div
var pleaseWaitDiv = document.getElementById("divPleaseWait");
//an example content div being refreshed via AJAX PRO
var contentDiv = document.getElementById("contentDiv");
//synchronous refresh of content
function RefreshAll()
{
if (isWorking) { return; } //no infinite recursion please!
isWorking = true;
pleaseWaitDiv.style.visibility = "visible";
if (mustReload)
{
Reload();
}
else
{
contentDiv.innerHTML = NAMESPACE.REFRESH_METHOD(
(currentEntity, contentDiv.offsetWidth,
contentDiv.offsetHeight).value;
}
pleaseWaitDiv.style.visibility = "hidden";
isWorking = false;
if (tmout != null)
{
clearTimeout(tmout);
}
}
var tmout2 = null;
var refreshInterval = 60000;
//periodic synchronous refresh of all content
function Refreshing()
{
RefreshAll();
if (tmout2 != null)
{
clearTimeout(tmout2);
tmout2 = setTimeout(Refreshing,refreshInterval);
}
}
//start periodic refresh of content
tmout2 = setTimeout(Refreshing,refreshInterval);
//clean up
window.onunload = function()
{
isWorking = true;
if (tmout != null)
{
clearTimeout(tmout);
tmout = null;
}
if (tmout2 != null)
{
clearTimeout(tmout2);
tmout2 = null;
}
很丑,但它确实有效 - 我猜它真正重要; - )
body onload 控制窗口大小 html,如何实现在调整浏览器窗口大小时缩放的网页?相关推荐
- 函数语法:JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度(转载)...
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
- html表格 根据窗口调整,如何根据浏览器窗口大小动态调整html表格
我希望我的网站根据网页浏览器的大小显示不同.基于来自其他用户的问题/答案,我得到了这个工作与JavaScript onload.但是我无法动态地实现它 - 也就是说,随着用户正在调整窗口,这是实时的. ...
- vue实现全屏登录视频背景并适配浏览器窗口大小
问题描述:接到一个需求,需要把登录页背景做成一个全屏的视频播放,并且能够根据浏览器窗口大小做到实时适配. 1.HTML结构 首先用一个最外层容器包裹整个登陆页面,最外层容器使用flex布局,有利于窗口 ...
- 计算机控制闪光灯,摄影技巧 闪灯篇 光圈控制主体 快门控制场景 闪光灯又该如何调整输出功率?...
先设定相机,后设定闪光灯.在离机闪领域,M 模式是应用上的大宗.在拍摄时,我们会面临两个问题,一个是闪光灯的出力(输出功率),另一个则是相机的测光.曝光设定.基本上,我们是先决定相机的设定值,再决定闪 ...
- JS 获取浏览器窗口大小
JS 获取浏览器窗口大小 <script>// 获取窗口宽度if (windows.innerWidth) {winWidth = windows.innerWidth;} else if ...
- 当浏览器窗口大小改变时,设置显示内容的高度
1 window.οnlοad=function(){ 2 changeDivHeight(); 3 } 4 //当浏览器窗口大小改变时,设置显示内容的高度 5 window.οnresize=fun ...
- js监听html页面大小变化,js实时获取浏览器窗口大小
js实时获取浏览器窗口大小,我们可以使用addEventListener()方法来实现.该addEventListener()方法可以注册事件处理程序以侦听浏览器窗口resize事件,例如window ...
- Echarts图表大小自适应浏览器窗口大小
1.mixins文件:resize.js // 当调整浏览器窗口大小时,发生 resize 事件:监听resize,实现Echarts图表大小自适应浏览器窗口大小 export default {da ...
- 获取浏览器窗口大小以及位置
前端开发有一个比较麻烦的事情就是需要关注与各种版本的浏览器的兼容,由于获取浏览器窗口大小与位置可能不会经常用到,所以我就把它们封装成了两个函数,以后用到可以直接引入,就不用再自己去花时间去做各种兼容. ...
最新文章
- AI回溯过去解决复杂任务 |《自然》论文
- 请描述一下 cookies,sessionStorage 和 localStorage 的区别?
- Storm单节点部署及启动
- junit 测试似有方法_Spring整合Junit的使用
- 03 | SRE切入点:选择SLI,设定SLO
- android蓝光播放器,安卓播放器真的拥有完美的蓝光原盘菜单导航吗?我来测试下...
- java-第三章-从键盘输入3个整数,然后将输入的整数按照从小到大的顺序放在abc,并输出3个变量的值...
- DotNET企业架构应用实践-数据库表记录的唯一性设计的设计兼议主键设定原则
- 中国湖北区域汉至现代行政区划GIS数据
- 我上网下载了rar压缩文件,有密码,用arpr工具怎么破解不了,_压缩文件密码
- 【JZOJ3424】粉刷匠
- DINO: 让目标检测拥抱Transformer!霸榜COCO!
- python transforms_PyTorch教程【六】Transforms的使用
- 雅士利处理器软件_雅士利/ASHLY DSP360 专业3进6出处理器
- Android 将本地资源图片转换成Drawable,进行设置大小
- which java 找不到jdk_一、查看Jdk的安装路径:whereis javawhich java (java执行路径)echo $JAVA_HOMEecho $PATH备注:如...
- ESX5.1 安装Hyper v
- Markdown学习第第二弹--分割线和标题
- 新东方雅思词汇---6.2、重音在词根上,不在前后缀(名词除外)
- Java工程师培训课(十一、新的开始)
热门文章
- ACRush 楼天城回忆录
- 深度linux 网络配置文件,solver及其配置 - Caffe 深度学习入门教程_Linux教程_Linux公社-Linux系统门户网站...
- array python 交集_模糊数学Python库简介和评测
- python 进程池 等待数量_【2020Python修炼记】python并发编程(六)补充—进程池和线程池...
- db2 获取返回的游标_MySQL ------ 存储过程与游标简单使用
- diff命令两个服务器文件,linux 比较两个文件夹不同 (diff命令, md5列表)
- sklearn中eof报错_sklearn中的数据预处理和特征工程
- mpvue小程序以及微信直播踩坑总结
- Flexible 弹性盒子模型之flex
- CSS3景深-perspective