使用按钮滚动iframe-iPhone [英] Scroll iframe using buttons - iPhone
问题描述
我正在创建一个网站,在其中使用iframe动态添加内容(iframe的文件位于同一服务器上).加载的iframe具有用于滚动iframe内容的按钮,但我找不到它在iPhone上不起作用的原因-在Android上效果很好.这是我使用的代码:
I'm creating the website where content is dynamically added using iframe (files of iframes are on the same server). Loaded iframe has buttons to scroll iframe content but I can't find a reason why it doesn't work on iPhone - it works well using Android. Here is the code I used:
$('#menu li a').on('click', function(){
var element = $(this).attr('data-scroll');
$('body').animate({
scrollTop: $('.page[data-bookmarks=' + element + ']').offset().top
}, 1000);
});
顺便说一句. click事件效果很好,因为我使用警报对其进行了检查.只是scrollTop似乎在iOS设备上不起作用.
Btw. click event works well, because I checked it using alert. Simply scrollTop seems doesn't work on iOS devices.
推荐答案
我发现了几个可以解决此问题的链接,但是我碰到最多的一个链接是:
I found several links that might solve this issue, but the one that I ran into the most was this:
控制溢出的div比
iFrames
容易得多,并且滚动+空白内容问题一直都可以追溯到iOS 4,以前我什至无法使两根手指滚动来工作(在iFrames
中).
It's much easier to control overflowed divs than it is
iFrames
, and the scrolling + blank content issues are working all the way back to iOS 4, where previously I wasn't even able to get the 2 finger scrolling to work (iniFrames
).
它是这样的:
<iframe id="example-iframe" width="600" height="200" src="a-file.html"></iframe>
a-file.html:
a-file.html:
<html>
<body>
<div id="wrapper" style="width: 100%; height: 100%; overflow: auto; -webkit-overflow-scrolling: touch;">
...
</div>
</body>
</html>
其他链接
- -webkit-overflow-scrolling:触摸不会服从" z-index
- iFrame滚动不适用于iPhone
- 在iOS设备上滚动iFrame
- iPad上的-webkit-overflow-scrolling:touch下拉菜单问题
- -webkit-overflow-scrolling: touch does not "obey" z-index
- iFrame scrolling doesn't work on an iPhone
- iFrame scrolling on an iOS device
- dropdown-menu problems with -webkit-overflow-scrolling:touch on the iPad
Other Links
这篇关于使用按钮滚动iframe-iPhone的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!