View Full Version : jQuery funcion not defined problem in firefox

10-15-2009, 11:27 AM
I get this message from firefox when the javascript function loadContent is called:
An error exists inside your "ontoggle" function:
ReferenceError: loadContent is not defined
Aborting execution of function.

I have an animated menu #left that expands and collapse (the text in #tavira) and loads with a fed in-out animation some content in a DIV (#right).

Here the javascript code

<script type="text/javascript">
animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted
if (divobj.id=="tavira" && state=="block") {
$('#left').append('<span id="load">LOADING...</span>');
var toLoad = divobj.id+'.html #right_in';
function loadContent() {
function showNewContent() {
function hideLoader() {




Here also the html code

<div id="left">
<div id="left_in">
<div style="width:408px;"> <a href="javascript:animatedcollapse.toggle('tavira')"><img src="picts/tavira.jpg" alt="tavira" width="222" height="26" border="0" /></a></div>
<div id="tavira" style="width:408px; height:150px; background: #fff; text-align:justify; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px;">
Some text here... </div>

<div id="right">
<div id="right_in">
<div style="padding-top:170px; padding-bottom:170px"><img src="picts/projekte/tavira/POR-A4.jpg" width="561" height="401" /></div>
<div style="padding-top:72px; padding-bottom:72px"><img src="picts/projekte/tavira/POR-A1.jpg" width="427" height="596" /></div>

Since it works just fine in safari I guess is a small code error, but to be honest Im not very familiar with javascript so I hope someone can help me.

Thanks in advance

10-15-2009, 06:22 PM
Since loadContent is defined inside the "if" block, Javascript won't create it unless the "if" condition is true. Functions which are defined outside any "if" statement get created right up front, so the solution is to put all your function definitions outside of any "if" blocks.