Sign in to follow this  
Lary

Page embeded with iframe Jump to Bottom when Tapping Canvas

Recommended Posts

I'm sorry for making the title that long....and also my content will be...

Recently I'm quite tortured by a tricky problem, mainly on iOS mobile, things are like this...

I inserted a Babylonjs project into a third-party homepage through iframe tags.  As you know, the home page has header, footer, another content and the iframe part.

When I scroll to the iframe part, and want to interact with the canvas, as long as I tap the canvas, the page jumps to the bottom immediately. Strange! 

I scroll back, and continue to pinch, rotate the canvas, it goes normally (do not touch other part, only the canvas after jumping). 

As long as I have tapped the UI, and then tap the canvas, history will happen again.  

I tried other projects (also build with Babylonjs), some will not have this problem. So I made a detailed comparison, excluding the potential problem raised by html ,css.

The main difference might be the version of Babylon.js.

The ones that have jumping problems use the babylon.3.1.1.min VERSION , while those don't have problem, use this Version , it's compressed and I forgot the version now.

Can anybody tell which version the latter is? and what's difference between them, especially about issues like canvas focus, tapping event on iOS...

The test link that having the problem is this , the visit speed might be slow out of China. But the problem will be like what I mentioned above.

I guess it's something about canvas.focus(). but not sure..I know you guys are more experienced and smarter. 

I would really appreciate!!!!!!!!

 

 

 

 

 

Share this post


Link to post
Share on other sites
16 minutes ago, Wingnut said:

Hi Lary.  "Fast service" is our middle name.

This is a browser issue, and not BJS, but we like to help with canvas things, too.

Check-out this stackOverflow subject.

In brief... document.getElementById("myWebGLCanvas").focus({preventScroll:true});    ...might work.  Good luck, report back - thx.

Hi Wingnut, you're faster than the flash! Will try that, thanks first!

Share this post


Link to post
Share on other sites
On 6/9/2018 at 11:56 PM, Wingnut said:

Hi Lary.  "Fast service" is our middle name.

This is a browser issue, and not BJS, but we like to help with canvas things, too.

Check-out this stackOverflow subject.

In brief... document.getElementById("myWebGLCanvas").focus({preventScroll:true});    ...might work.  Good luck, report back - thx.

Hi Wingnut, the method by setting the canvas.focus({preventScroll:true}) seems not workable....Sorry about that, anyway thanks again.

But I tried replacing the babylonjs version (babylon.3.1.1.min.js.) that has the scrolling problem with that not having the problem (Babylon.js engine (v3.1-alpha)), it works well.

So I can partially confirm that there's difference in both versions that affecting the canvas focus.

I need to look into it, I would be much appreciate if you could supply some information.

:D

Share this post


Link to post
Share on other sites

Hmm, yeah, then I guess you are correct.  Sorry about that.  Let's ping @Deltakosh and see what he says. 

Oh, I guess you DID ping him, earlier. 

Darn.  I'll keep thinking.  You even told me that one version of BJS worked and another didn't... in your first post!

What, was I sleeping when I read that?  Sorry.  (Wingnut bonks himself on the head with a 2 by 4 to see if his reading improves).

I have had THREE times when I didn't read the user's post correctly... in the last 3 weeks.  I'm surely falling apart, mentally. :)

Share this post


Link to post
Share on other sites
On 6/11/2018 at 1:17 AM, Wingnut said:

Hmm, yeah, then I guess you are correct.  Sorry about that.  Let's ping @Deltakosh and see what he says. 

Oh, I guess you DID ping him, earlier. 

Darn.  I'll keep thinking.  You even told me that one version of BJS worked and another didn't... in your first post!

What, was I sleeping when I read that?  Sorry.  (Wingnut bonks himself on the head with a 2 by 4 to see if his reading improves).

I have had THREE times when I didn't read the user's post correctly... in the last 3 weeks.  I'm surely falling apart, mentally. :)

Hi @Wingnut and @Deltakosh, sorry to inform you late, finally I found a solution, by deleting the "canvas.tabindex = 1", then it works, though I don't know why..anyway, thanks!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.