Cannot read property 'offsetTop'

[IB-VT]

I tried to use this fantastic plug-in and it works well, as long there is no navigation bar at the top of the site.

When using the bootstrap navigation bar, smartscroll generates the error "Cannot read property 'offsetTop'" on chrome or a "Die Eigenschaft "offsetTop" eines undefinierten oder Nullverweises kann nicht abgerufen werden." (property "offsetTop" of a undefined Null-reference could not be read) on IE.

Is it possible to set an offset for the page top ?

[d4nyll]

Thanks for letting me know, do you think it'd be possible for you to host your site somewhere so I can directly debug from there?

[IB-VT]

Hi Daniel,

thanks for the fast reply, the site is online at: www.ib-barwich.de/test

I tried to figure out if there is any interacting with other scripts used by the site, but could not find the problem yet.

[d4nyll]

I took a look at your markup.

Right now, the structure needs to be:

<div class="section-wrapper">
    <div class="section" data-hash="section-hash-name"></div>
    <div class="section" data-hash="section-hash-name"></div>
</div>

Where the section needs to be direct children of the container. Also, for the time being, there cannot be anything in between the sections (which is part of the 'Requirements' - There can only be one set of adjoining sections).

So you'd need to structure it that way.

Also for the time being, hybrid scroll doesn't work at the bottom #8, so you'd have to scrolljack down to the 'Contact' section. But I aim to fix this soon.

Please let me know if that's possible for you, and whether you're able to resolve the issue!

[maoosi]

I got the same problem using html5 tags structure.

Solved it by replacing css selector used on smartscroll.js, line 106:
replace :nth-of-type by :nth-child

@d4nyll is there any particular reason you used :nth-of-type ?

[d4nyll]

@maoosi I used :nth-of-type because originally, I wanted to allow the users to have other things inside the section wrapper. But now I can change it to :nth-child, it'd be equivalent. Still I am curious why :nth-of-type didn't work...

[maoosi]

Because :nth-of-type selector is attached to a particular type, so if we don't want to use the same tag type (something different from a <div> like <section> or <article>, or even differents types inside the same parent element), it will not work anymore.

I think you can replace all your :nth-of-type by :nth-child everywhere it's used in your plugin in order to make it more flexible.

[d4nyll]

@maoosi That's a very good point I didn't consider. I will update it in the next push! Thanks!