在站点的javascript上接收空错误代码

我正在尝试创建一个粘性菜单。我的代码在JSFIDLE中工作得很好，但当我将其转移到我的站点时，它就不工作了。在我的控制台中，我看到错误：

Typeerror:fixheader为空

这是我的javascript：

<script type="text/javascript">
    window.onscroll = function() {myFunction()};

var fixheader = document.getElementById("fixheader");
var sticky = fixheader.offsetTop;

function myFunction() {
  if (window.pageYOffset >= sticky) {
    fixheader.classList.add("sticky")
  } else {
    fixheader.classList.remove("sticky");
  }
}
    </script>

window.onscroll=function（）{myFunction（）}；
var fixheader=document.getElementById（“fixheader”）；
var sticky=fixheader.offsetTop；
函数myFunction（）{
如果（window.pageYOffset>=粘性）{
fixheader.classList.add（“粘性”）
}否则{
fixheader.classList.remove（“粘性”）；
}
}

HTML:

我的JSFIDLE在这里：

我该如何解决这个问题？我在堆栈溢出中搜索了类似的问题，但似乎没有一个与我的编码完全相关。提前谢谢。 谢谢

---

编辑：谢谢大家！设法把它修好了。这是两件事的结合；1） javascript需要向下移动，因为调用它太早了，2）我在那里有一个CSS样式覆盖了静态位置，所以它不会显示。一切都解决了

您收到一个类型错误，这意味着元素不在页面上（确保其id确实是fixheader），或者脚本元素位于元素上方，并且在加载之前执行代码。

请在此处粘贴HTML的相关部分。除此之外，我认为您的代码没有任何问题。默认情况下，JSFIDLE在加载事件处理程序中运行代码。是否可以修改我的代码以执行相同的操作？如果是这样的话，怎么做？要么将函数调用放入或window.onload=init\u on\u load；每JQuery$（document）.ready（）。谢谢！代码肯定在那里。我也试着移动到页脚，虽然它不再显示错误消息，但根本不起作用。这几乎是多余的。我真的想知道为什么这被否决了…我不知道。不是我。看起来好像有人投了所有的票。

        <div id="fixheader">
            <div class="inner">
                <div id="ToggleMenu" class="fa fa-bars normal"></div>
                <div class="header-logo">
                    <a href="https://www.myurl.com/"><img src="https://cdn10.bigcommerce.com/s-fctqc2/product_images/logo_website_1464304863__33790.png" id="LogoImage" alt="http://www.myurl.com/" border="0"></a>

                </div>
                <div class="header-secondary">
                    <ul class="pages-menu sf-menu sf-horizontal sf-js-enabled">
        <li class="HasSubMenu">
        <a href="http://www.myurl.com/meet-them/" class="sf-with-ul"><span>zip</span><span class="sf-sub-indicator"> »</span></a>
        <ul style="display: none; visibility: hidden;">
    <li><a href="https://www.myurl.com/meet-them/">Meet Them!</a></li><li><a href="http://www.myurl.com/free-patterns-them/">Patterns</a></li><li><a href="https://www.myurl.com/videos/">Videos</a></li>
</ul>
    </li>   <li class="HasSubMenu">
        <a href="http://www.myurl.com/wood-looms/" class="sf-with-ul"><span>Shop</span><span class="sf-sub-indicator"> »</span></a>
        <ul style="display: none; visibility: hidden;">
    <li><a href="/wood-looms/">Wood Looms</a></li><li><a href="/plastic-looms/">Plastic Looms</a></li><li><a href="/sock-looms/">Sock Looms</a></li><li><a href="/zip-looms/">zip Looms</a></li><li><a href="/kits/">Loom Kits / Bundles</a></li><li><a href="/accessories">Accessories</a></li><li><a href="/books/">Books</a></li><li><a href="/yarn">Yarn</a></li><li><a href="http://www.myurl.com/giftcertificates.php">Gift Certificates</a></li>
</ul>
    </li>   <li class="HasSubMenu">
        <a href="/free-downloadable-patterns/" class="sf-with-ul"><span>Free Patterns</span><span class="sf-sub-indicator"> »</span></a>
        <ul style="display: none; visibility: hidden;">
    <li><a href="https://www.myurl.com/meet-our-designers/">Meet Our Designers</a></li>
</ul>
    </li>   <li class="HasSubMenu">
        <a href="https://www.myurl.com/learn/" class="sf-with-ul"><span>Learn</span><span class="sf-sub-indicator"> »</span></a>
        <ul style="display: none; visibility: hidden;">
    <li><a href="/videos">Videos</a></li><li><a href="https://www.myurl.com/loom-knitting-how-tos/">Loom Knitting How To's</a></li><li><a href="https://www.myurl.com/about-us/">About Us</a></li>
</ul>
    </li>   <li class="">
        <a href="http://blog.myurl.com"><span> BLOG</span></a>

    </li>   <li class="">
        <a href="https://www.myurl.com/faqs/"><span>FAQs</span></a>

    </li>
    <!-- <li class="ic-top-search-green"><a id="search-li" title="Search" onclick="kb_showSearch()" style="display:block;width:100%">&nbsp;</a></li> -->

    <div id="SearchForm" class="cf search-dialog" title="Search" style="">
        <form action="https://www.myurl.com/search.php" method="get" onsubmit="return check_small_search_form()">
            <label for="search_query">Search</label>
            <input type="text" name="search_query" id="search_query" class="Textbox autobox default" value="Search">
            <input type="submit" class="Button" value="" name="Search" title="Search">
        </form>
    </div>

    <script type="text/javascript">
        var QuickSearchAlignment = 'right';
        var QuickSearchWidth = '390px';
        lang.EmptySmallSearch = "You forgot to enter some search keywords.";
        // uniform() is deprecated in Blueprint theme; remove binding below when removing uniform
        $(document).ajaxComplete(function() {
            $('input[type=checkbox], select').not('.UniApplied').uniform();
        });
    </script>
</ul>
                </div>
                <div id="cart-amount">
                    <a href="https://www.myurl.com/cart.php" class="Cart"><span class="bag-handle"></span><span class="total"></span></a>
                </div><!-- end cart-amount -->
            </div><!-- end inner -->
        </div><!-- end Header -->
    </div><!-- end inner -->
</div>