How to control anchor scrolling?

  • Hi all

    I’m having a problem with using anchors. I use them to anchor an image (at the top of the page) to an audio player further down the page.

    They work fine, but beneath the audio player is usually some text. The length of this text varies. If it’s just a paragraph or so that’s beneath the audio player, the anchor scrolls to just the right position: the audio player jumps to somewhere near to the middle of the screen. Perfect.

    But. If there’s a bit more text beneath the audio player, it’s like the anchor is trying to fit as much of that on the screen as possible, and as a result the audio player appears right at the very top of the screen and the focus of anyone visiting the site is on the text, not the audio player.

    My anchor looks like this:

    <a name="player"></a>
<iframe ----audio player goes here---- </iframe>

    And some text goes here.

    This is a link to the page so you can see what I mean:

    https://www.bibliophone.com/the-butterfly-by-gregory-heath/

    Am I doing something wrong? Is there a [simple!] solution to this?

    Thanks as ever,

    Paul

Viewing 4 replies - 1 through 4 (of 4 total)

  • Or you can use this type of anchor tag

    <iframe id="player"></iframe>

    Thread Starter paulmc911

    (@paulmc911)

    Hey thanks Sakar. So where would I place that in the above? I know it’s a basic question but 1) I’m a basic person and 2) I think where I put it might be causing the issue!

    Thanks

    Paul

    No you are puting the name in the anchor tag called player but you can also achieve it by puttin id player in the iframe.

    its just you remove the line

    <a name="player"></a>

    and add id=”player” in the iframe tag

    Thread Starter paulmc911

    (@paulmc911)

    Ok I tried that and the anchor works as before – it still scrolls too far down the page.. Any ideas?

    Thanks for your help.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘How to control anchor scrolling?’ is closed to new replies.