{"id":9613,"date":"2022-09-19T20:04:39","date_gmt":"2022-09-19T14:34:39","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/"},"modified":"2022-09-19T20:04:39","modified_gmt":"2022-09-19T14:34:39","slug":"solved-how-to-solve-the-error-can-not-read-property-top-of-null","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/","title":{"rendered":"[Solved] How to solve the error ” Can not read property ‘top’ of null “?"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n
<\/div>\n
\n
\n
    \n
  1. You do not HAVE anything in your HTML with id=welche-vorteile for example<\/li>\n
  2. You need to show us where your navigation sits, because as you can see, even with Math.floor, you never get the values to match<\/li>\n
  3. You also seem to do several things on scroll which you should do in one on(“scroll”) – if you have jQuery use it consistently<\/li>\n<\/ol>\n
    \n
    \n
    $(document).ready(function() {\r\n  $(document).on(\"scroll\", onScroll);\r\n});\r\n\r\nfunction onScroll(event) {\r\n  var scrollPos = Math.floor($(document).scrollTop());\r\n  $('#myP a').each(function() {\r\n    var $currLink = $(this),\r\n      href = $currLink.attr(\"href\"),\r\n      $refElement = $(href);\r\n    if ($refElement.length>0) {\r\n      var top = Math.floor($refElement.position().top),\r\n        height = Math.floor($refElement.height()),\r\n        activate = top <= scrollPos && scrollPos < (top + height)\r\n      $(\"#pos\").text(top + \"<=\" + scrollPos + \"&&\" + scrollPos + \"<\" + (top + height))\r\n      $(this).toggleClass(\"active\", activate);\r\n    }\r\n    else {\r\n      console.log(\"Nothing found in the page with id\",href)\r\n    }\r\n  });\r\n}<\/code><\/pre>\n
    a {\r\n  text-decoration: none\r\n}\r\n\r\n.active {\r\n  text-decoration: underline: color: red\r\n}<\/code><\/pre>\n
    <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jquery\/3.3.1\/jquery.min.js\"><\/script>\r\n<div id=\"myP\" class=\"\" style=\"position:fixed\">\r\n  <div class=\"content-counter\"><span id=\"hs_cos_wrapper_widget_1569937812303_\" class=\"hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_simple_menu\" style=\"\" data-hs-cos-general-type=\"widget\" data-hs-cos-type=\"simple_menu\"><div id=\"hs_menu_wrapper_widget_1569937812303_\" class=\"hs-menu-wrapper active-branch flyouts hs-menu-flow-horizontal\" role=\"navigation\" data-sitemap-name=\"\" data-menu-id=\"\" aria-label=\"Navigation Menu\">\r\n     <ul>\r\n      <li class=\"hs-menu-item hs-menu-depth-1\"><a href=\"#welche-vorteile\" role=\"menuitem\" target=\"_self\">Welche Vorteile versprechen Robo-Advisors ihren Kunden?<\/a><\/li>\r\n      <li class=\"hs-menu-item hs-menu-depth-1\"><a href=\"#wie-werde-ich\" role=\"menuitem\" target=\"_self\">Wie werde ich Kunde bei einem Robo-Advisor?<\/a><\/li>\r\n\r\n     <\/ul>\r\n    <\/div><\/span><\/div>\r\n  <div style=\"padding-top: 30px;\"><span style=\"padding:10px; color: #fff; font-size: 1.5em;\" class=\"b-toggler bg-theme wb-icon whitebox-navigation-menu\"><\/span><\/div>\r\n<\/div>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<div id=\"welche-vorteile\">Welche Vorteile <span id=\"pos\"><\/span><\/div>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p>\r\n<p>...<\/p><\/code><\/pre>\n<\/div>\n<\/div><\/div>\n
    <\/div>\n<\/div>\n
                <\/span> <\/p><\/div>\n<\/div>\n
    [ad_2]<\/p>\n
    solved How to solve the error ” Can not read property ‘top’ of null “? <\/p>\n","protected":false},"excerpt":{"rendered":"
    [ad_1] You do not HAVE anything in your HTML with id=welche-vorteile for example You need to show us where your navigation sits, because as you can see, even with Math.floor, you never get the values to match You also seem to do several things on scroll which you should do in one on(“scroll”) – if … Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[320],"tags":[333,388,2700],"class_list":["post-9613","post","type-post","status-publish","format-standard","hentry","category-solved","tag-javascript","tag-jquery","tag-onscroll"],"yoast_head":"\n[Solved] How to solve the error " Can not read property 'top' of null "? - JassWeb<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"[Solved] How to solve the error " Can not read property 'top' of null "? - JassWeb\" \/>\n<meta property=\"og:description\" content=\"[ad_1] You do not HAVE anything in your HTML with id=welche-vorteile for example You need to show us where your navigation sits, because as you can see, even with Math.floor, you never get the values to match You also seem to do several things on scroll which you should do in one on(“scroll”) – if ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\" \/>\n<meta property=\"og:site_name\" content=\"JassWeb\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-19T14:34:39+00:00\" \/>\n<meta name=\"author\" content=\"Kirat\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirat\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\"},\"author\":{\"name\":\"Kirat\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\"},\"headline\":\"[Solved] How to solve the error ” Can not read property ‘top’ of null “?\",\"datePublished\":\"2022-09-19T14:34:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\"},\"wordCount\":91,\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"keywords\":[\"javascript\",\"jquery\",\"onscroll\"],\"articleSection\":[\"Solved\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\",\"url\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\",\"name\":\"[Solved] How to solve the error \\\" Can not read property 'top' of null \\\"? - JassWeb\",\"isPartOf\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#website\"},\"datePublished\":\"2022-09-19T14:34:39+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/jassweb.com\/solved\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"[Solved] How to solve the error ” Can not read property ‘top’ of null “?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/jassweb.com\/solved\/#website\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"name\":\"JassWeb\",\"description\":\"Build High-quality Websites\",\"publisher\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/jassweb.com\/solved\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/jassweb.com\/solved\/#organization\",\"name\":\"Jass Web\",\"url\":\"https:\/\/jassweb.com\/solved\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"contentUrl\":\"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png\",\"width\":693,\"height\":132,\"caption\":\"Jass Web\"},\"image\":{\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31\",\"name\":\"Kirat\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"contentUrl\":\"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750\",\"caption\":\"Kirat\"},\"sameAs\":[\"http:\/\/jassweb.com\"],\"url\":\"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"[Solved] How to solve the error \" Can not read property 'top' of null \"? - JassWeb","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/","og_locale":"en_US","og_type":"article","og_title":"[Solved] How to solve the error \" Can not read property 'top' of null \"? - JassWeb","og_description":"[ad_1] You do not HAVE anything in your HTML with id=welche-vorteile for example You need to show us where your navigation sits, because as you can see, even with Math.floor, you never get the values to match You also seem to do several things on scroll which you should do in one on(“scroll”) – if ... Read more","og_url":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/","og_site_name":"JassWeb","article_published_time":"2022-09-19T14:34:39+00:00","author":"Kirat","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirat","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#article","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/"},"author":{"name":"Kirat","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31"},"headline":"[Solved] How to solve the error ” Can not read property ‘top’ of null “?","datePublished":"2022-09-19T14:34:39+00:00","mainEntityOfPage":{"@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/"},"wordCount":91,"publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"keywords":["javascript","jquery","onscroll"],"articleSection":["Solved"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/","url":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/","name":"[Solved] How to solve the error \" Can not read property 'top' of null \"? - JassWeb","isPartOf":{"@id":"https:\/\/jassweb.com\/solved\/#website"},"datePublished":"2022-09-19T14:34:39+00:00","breadcrumb":{"@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/jassweb.com\/solved\/solved-how-to-solve-the-error-can-not-read-property-top-of-null\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/jassweb.com\/solved\/"},{"@type":"ListItem","position":2,"name":"[Solved] How to solve the error ” Can not read property ‘top’ of null “?"}]},{"@type":"WebSite","@id":"https:\/\/jassweb.com\/solved\/#website","url":"https:\/\/jassweb.com\/solved\/","name":"JassWeb","description":"Build High-quality Websites","publisher":{"@id":"https:\/\/jassweb.com\/solved\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/jassweb.com\/solved\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/jassweb.com\/solved\/#organization","name":"Jass Web","url":"https:\/\/jassweb.com\/solved\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/","url":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","contentUrl":"https:\/\/jassweb.com\/wp-content\/uploads\/2021\/02\/jass-website-logo-1.png","width":693,"height":132,"caption":"Jass Web"},"image":{"@id":"https:\/\/jassweb.com\/solved\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/65c9c7b7958150c0dc8371fa35dd7c31","name":"Kirat","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/jassweb.com\/solved\/#\/schema\/person\/image\/","url":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","contentUrl":"https:\/\/jassweb.com\/solved\/wp-content\/litespeed\/avatar\/1261af3c9451399fa1336d28b98ea3bb.jpg?ver=1775798750","caption":"Kirat"},"sameAs":["http:\/\/jassweb.com"],"url":"https:\/\/jassweb.com\/solved\/author\/jaspritsinghghumangmail-com\/"}]}},"_links":{"self":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/9613","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/comments?post=9613"}],"version-history":[{"count":0,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/posts\/9613\/revisions"}],"wp:attachment":[{"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/media?parent=9613"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/categories?post=9613"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jassweb.com\/solved\/wp-json\/wp\/v2\/tags?post=9613"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}