Unable to get property 'top' of undefined or null reference (IE 11)

Question

I'm pretty inexperienced with JavaScript and am using a template. Cannot seem to figure out why this error appears in Internet Explorer. It works in every other browser.

$('.navbar a, .navbar li a, .brand, #footer li a, .more a, a.go-top')
  .bind('click', function(event) {
    var $anchor = $(this),
    scrollVal = $($anchor.attr('href')).offset().top - 60;

    if (scrollVal < 0) {
      scrollVal = 0;
    }

    $('[data-spy="scroll"]').each(function() {
      $(this).scrollspy('refresh');
    });

    $.scrollTo(scrollVal, {
      easing: 'easeInOutExpo',
      duration: 1500
    });

    event.preventDefault();
  });

Any ideas why this is happening?

Answer 1

the error you are seeing is in the line 4

    scrollVal = $($anchor.attr('href')).offset().top - 60;

it is a commonly because you are trying to use a propierty of an object and it is undefined.

in your case $($anchor.attr('href')).offset() is probably undefined, you need to see if $anchor is undefined or it not have the propierty href so it can't have the ofset

you can use developer tools (F12) and a breack point to inspect the values.

you can learn how to do it in: how to use console

good luck