移动迷你浏览器：如何在保持页面偏移位置的同时重新加载图像？

发布于 2024-08-17 04:28:52 字数 1387 浏览 9 评论 0原文

在移动网络迷你浏览器中，window 对象似乎没有任何意义——因为只有一个窗口可以显示。因此，像 window.pageYOffset=320 这样的东西没有任何意义（据我所知）。

给出一个简单的例子，例如地图放大/缩小，似乎

<html>
<head>
<title>zoom.html</title>
<script language="javascript">
var zoom=15;
var vpos=window.pageYOffset;
var key="whatever-your-Google-Maps-site-key-is";
function setImgSrc(z) {
    document.getElementById('img').src=
    "http://maps.google.com/maps/api/staticmap?center=Lisbon,Portugal&zoom="
    +zoom+"&size=400x400&maptype=roadmap&sensor=false&key="+key;
}
function zoomin()   
{ if(zoom<=18) zoom++; vpos=window.pageYOffset; setImgSrc(zoom); }
function zoomout()  
{ if(zoom>=1)  zoom--; vpos=window.pageYOffset; setImgSrc(zoom); }
</script>
</head>
<body onload="javascript:setImgSrc(15);">
<h1>zoom</h1>
<p><img id="img" alt="Lisbon,Portugal"/></p><p>
&nbsp;&nbsp;<a onclick="javascript:zoomin()">[+]</a>&nbsp;&nbsp;
&nbsp;&nbsp;<a onclick="javascript:zoomout()">[&ndash;</a>&nbsp;&nbsp;
</p><hr></body></html>

在桌面浏览器上运行良好；所以我问：我如何表明，在更新页面时（onclick似乎不适用于迷你浏览器，但href可以）它应该将页面偏移到以前的职位？（由于其他原因，简单地将页面（重新）加载到给定的 named 锚点无法解决我正在处理的问题。）

提前感谢您的反馈。

原文

In mobile web minibrowsers, it seems that the window object makes no sense — since there's only one window to show. Therefore, things like window.pageYOffset=320 make no sense (as far as I can tell).

Given a simple example such as a map zoomin/zoomout such as

<html>
<head>
<title>zoom.html</title>
<script language="javascript">
var zoom=15;
var vpos=window.pageYOffset;
var key="whatever-your-Google-Maps-site-key-is";
function setImgSrc(z) {
    document.getElementById('img').src=
    "http://maps.google.com/maps/api/staticmap?center=Lisbon,Portugal&zoom="
    +zoom+"&size=400x400&maptype=roadmap&sensor=false&key="+key;
}
function zoomin()   
{ if(zoom<=18) zoom++; vpos=window.pageYOffset; setImgSrc(zoom); }
function zoomout()  
{ if(zoom>=1)  zoom--; vpos=window.pageYOffset; setImgSrc(zoom); }
</script>
</head>
<body onload="javascript:setImgSrc(15);">
<h1>zoom</h1>
<p><img id="img" alt="Lisbon,Portugal"/></p><p>
  <a onclick="javascript:zoomin()">[+]</a>  
  <a onclick="javascript:zoomout()">[–</a>  
</p><hr></body></html>

which seems to work well on desktop browsers; so I ask: how can I indicate that, on updating the page (onclick doesn't seem to work on minibrowsers, but href does) it should offset the page to the previous position?
(For other reasons, simply (re)loading the page to a given named anchor isn't working on the problem I'm dealing with.)

Thanks in advance for your feedback.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

歌枕肩 2024-08-24 04:28:52

当你回答自己的问题时，不是很可爱吗？嗯...

无论如何，根据 this，JavaScript 的一些属性/函数（ JScript？）window 对象根据浏览器（Firefox、IE 等）的选择具有不同的表示形式。因此，可能的页面垂直偏移函数是：

function setPageVPos(w,vpos) {
  try { w.scrollTo(0,vpos); } catch(e) {}
  try { w.document.body.scrollTop(vpos); } catch(e) {}
}

第一次尝试在 Firefox 浏览器中使用 window.scrollTo 实现，第二次尝试在 Firefox 浏览器中使用 document.body.scrollTop 实现IE浏览器。我已经在 Firefox（桌面）浏览器和类似 HP iPaq IE（移动）的迷你浏览器中进行了测试，并且可以在这两种浏览器上运行。

Isn't it lovely when you answer your own questions? Hmmm...

Anyway, according to this, some properties/functions for the JavaScript (JScript?) window object have different representations according to the choice of browser (Firefox, IE, etc.). Therefore, a possible page vertical offset function would be

function setPageVPos(w,vpos) {
  try { w.scrollTo(0,vpos); } catch(e) {}
  try { w.document.body.scrollTop(vpos); } catch(e) {}
}

The first tries with the window.scrollTo implementation in Firefox browsers, and the second tries with the document.body.scrollTop implementation in IE browsers. I've tested in both Firefox (desktop) browser and in a HP iPaq IE-like (mobile) minibrowser and works on both.

回复收藏 0 原文

~没有更多了~