JavaScript – Uncaught TypeError: Cannot Read Property ‘HoverAlls’ of Null

javascript

I can't figure out why I'm getting this error. I have read all documentation provided by the developer.

I placed this code in the Layout Update XML window: 

<default>
<reference name="head">
    <block type="core/text" name="your.block.name">
       <action method="setText">
          <text><![CDATA[<script type="text/javascript">
    $(window).load(function(){
        $('.HoverAlls_Caption').HoverAlls({
            "coords":"0,100||0,75||0,100",
            "text_coords":"0,50||0,5||0,50",
            "speed" : "220,220",
            "text_speed" : "400,200",
            "opacity" : "0,1",
            "link_control" : "false,_blank",
            "bg_class" : "captionBackground",
            "text_class" : "captionText"
        });
    });
</script>]]></text>
       </action>
    </block>
    </reference>
</default>

Here is the site I'm trying to work on: http://staged.tailwatersflyfishing.com

Username: admin
Password: admin

Thank you in advance! 🙂

Best Answer

I'm guessing above code is jQuery. In that case you'll need to wrap the code to prevent issues with the Magento Prototype library

<default>
<reference name="head">
    <block type="core/text" name="your.block.name">
       <action method="setText">
          <text><![CDATA[<script type="text/javascript">
    jQuery.noConflict(); // prevent conflicts with prototype

    (function($){ // and wrap it
    $(window).load(function(){
        $('.HoverAlls_Caption').HoverAlls({
            "coords":"0,100||0,75||0,100",
            "text_coords":"0,50||0,5||0,50",
            "speed" : "220,220",
            "text_speed" : "400,200",
            "opacity" : "0,1",
            "link_control" : "false,_blank",
            "bg_class" : "captionBackground",
            "text_class" : "captionText"
        });
    });
    })(jQuery);
</script>]]></text>
       </action>
    </block>
    </reference>
</default>
Related Topic