makotot/react-scrollspy

Sections larger than the screen result in no active HREF

evantahler opened this issue · 3 comments

evantahler commented

Hi!

Say you have large section chunks which are larger than the viewport. If you are scrolling down the page, you'll end up in a situation where no <li> is highlighted, as no anchor is actually on the page. Should not the most recent highlight remain 'lit' until the next one appears?

andrew-wharton commented

I ran into the problem, but I have a feeling that the proper fix for this is to use the recommended HTML5 document structure and outline.

The id can then be attached to the relevant section and this becomes a non-issue. I was running into this because I was using the HTML4 way of structuring documents where the id was on the heading, and there was no containing <section>.

My vote would be to close this as 'won't fix' and to add into the docs/README a word or two about using the HTML5 document structure.

  • 👍2
mykter commented

Thanks Andrew. fwiw you don't need to use <section> or similar - just have a container of some type with the id set, e.g. a div.

veksen commented

It's not always easily possible, take for example, some Markdown document with headers as anchor. There is no meaningful way to render this is markdown, aside from headers. I'm fairly certain I'm not the only with this problem!

  • 👍3