Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught TypeError: Cannot read property 'offsetWidth' of null #61

Closed
patrykKlimczak opened this issue May 27, 2017 · 2 comments
Closed

Comments

@patrykKlimczak
Copy link

I have a problem with class .siema where I don't have declaration on the page. I use wordpess and I had declaration only in page front-page.php and I when go to any other website for examaple search.php I have error in my console.

My errror:
main.js?ver=4.7.5:1901 Uncaught TypeError: Cannot read property 'offsetWidth' of null

var mySiema = new Siema({ perPage: { 480: 2, 1024: 3, 1200: 4, }, loop: true, }); document.querySelector('.prev').addEventListener('click', function() { return mySiema.prev(); }); document.querySelector('.next').addEventListener('click', function() { return mySiema.next(); });

Maybe you have any solve my problem.

@pawelgrzybek
Copy link
Owner

It looks like you have an instance with a selector that doesn't exist. Plugin comes with basic check:

https://github.com/pawelgrzybek/siema/blob/master/src/siema.js#L100

...but before that script checks the selector with:

https://github.com/pawelgrzybek/siema/blob/master/src/siema.js#L15

For the time being you can do something like...

if (document.querySelector('.siema')) {
  const mySiema = new Siema();

  document.querySelector('.prev').addEventListener('click', () => mySiema.prev());
  document.querySelector('.next').addEventListener('click', () => mySiema.next()); 
}

Next version of Siema will come with fix for this issue. Thanks again.

pawelgrzybek added a commit that referenced this issue Jun 1, 2017
@thurulingas
Copy link

I'm also getting this issue, but in my case it's because ngx-siema is expecting to be rendered and have its selector available on DOM ready, but I'm loading the carousel in an Angular modal, so the content isn't present until the modal component is created on user action. I can solve this by reworking how the modal works, but it'd be useful to have some way of having Siema delay resolving the specified selector until (for example) a callback was fired from a button.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants