Page jumps to HTML Embed on Page Load

Design help General
1

When my home page loads in my browser, the page jumps to an HTML embed farther down the page from the top. I obviously want my home page to load at the top.

Most of the people who have had the same problem of a page jumping cite an autofocus feature turned on within a form. My page is not jumping to a form, it’s jumping to a Div Block with a 1) heading, 2) code embed, and 3) paragraph. It’s not even jumping to the first Div Block in my Container, it is jumping to the 2nd one.

Website Jumps To Here
Website Jumps To Here169×262 6.24 KB

Here’s what I have tried so far:

  • Checking all the text fields in the form in the footer at the bottom of my page. Autofocus was turned off on all of them.
  • Checking the HMTL embed code for anything suspicious that might redirect the page there, such as an anchor or other code. Did not see anything suspicious. The code is here. ()
  • Deleting the Code Embed element in the Div Block. This caused the page to load at the top.
  • Adding the Code Embed element back to the Div Block. This caused the page to resume jumping down to the HTML embed.
  • Substituting the HTML Embed code with the embed code from a YouTube element. The page loaded at the top.

Does anyone have any advice on how to fix my page continuing to load at the point of an HTML embed?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Share your published & readonly designer links?

3

Hey @MemorableLearning ,

While this is an old thread so not sure if the tip works still, did you come across this and test the suggestion mentioned there?

And also as said above, a read-only link of the site would be helpful.

4

Sorry. It’s my first time posting here. I thought I had shared my read-only link, but I guess I didn’t.

Here it is: Webflow - Memorable Learning

5

Thank you for posting.
I did see that old thread and tried to add that code to the embed code, but it did not seem to work for me.

6
7

To isolate the issue, remove each IFRAME embed, on at a time, then test.

8

The problem appears to be inside of the content player itself. Check the settings and documentation for the player you’re using to see if it has some kind of scroll-into-view setting switched on.

9

.container class has a height of 100%

10

Okay got it.

I am guessing this is something to do with internal linking or having some href pointing to the page itself etc. If you can find the relevant setting or JS in the static page that you have embedded, you can get rid of it.

If you are not able to find it, as a workaround, you can probably try this out:

In the Code embed:

<iframe width="100%" height="0" src="REPLACE_WITH_URL" title="Articulate Storyline Demo Module" frameborder="0" id="history" style="display: none;"></iframe>

In the Before body of custom code section in the page:

<script>
  document.addEventListener('DOMContentLoaded', function() {
    const iframeToFix = document.getElementById('history');
    if (iframeToFix) {
      iframeToFix.onload = function() {
        setTimeout(() => {
          window.parent.scrollTo(0, 0);
          iframeToFix.style.height = '720px';
          iframeToFix.style.display = 'block';
        }, 100);
      };
    }
  });
</script>

Let me know if this helps.

11

Thank you to all who posted. I’m impressed by how much support I received when I needed it.

I changed the iframe embed code as AJ_Dev suggested. Then, I inserted a block of code (the script) that AJ_Dev provided into an embed code before the iframe embed code. I no longer see the embedded iframe in Webflow, but when I published the modified page it now works on the live website.

When I reload the page on the live website it leaps to the top instead of down to the embedded module. My embedded module also appears and seems to be functioning normally.

Thank you for the assistance AJ_Dev.

12

Welcome @MemorableLearning!

Glad to be of help.

You can place the script block in the Before body tag section of the page’s custom code settings instead of before the iframe embed code:

image
image747×312 11 KB

That being said, glad it works!