使用按钮滚动iframe-iPhone [英] Scroll iframe using buttons - iPhone

查看:104
本文介绍了使用按钮滚动iframe-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 (in iFrames).

它是这样的:

<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>

其他链接

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆