custom event not working
Hi,
I am (as a beginner) stuck in a problem with a custom event I created (for the first time).
The situation is that I have a template dynamically loaded in my main page that in it contained a div #character.
At the time the template is inserted in the containing div (on the main page) #character (as part of the new inserted html) has to be invisible.
Then I wanted to create a custom event called "fullPageReady" that is triggered in a seperate function to tell the div #character to fade in (and other things, too). In one word to start a range of functionality previously „sleeping“.
In the template code I did:
<script type="text/javascript" language="JavaScript">
$(window).bind( "fullPageReady", function() {
$('#character')
.delay(500)
.fadeIn(2400, 'easeOutSine')
.children()
.animate({'max-width': '100%','max-height': '100%'},2400,'easeOutSine');
$('#nav').children().removeClass("absolute").addClass("fixed");
});
</script>
The function to start it (as I said after it is already inserted in the main html) is:
function blindFullPage(){
…
$(window).trigger( "fullPageReady" );
…
});
Sadly nothing happens :-(
I guess it has to do with this js is not declarative thing or the need of event delegation
for probably on the time the template code is parsed the trigger is not yet done and afterwards it doesn’t pass by again. But I don’t know. It’s too high for me. :-(
What I am doing wrong here and
how is this to be done properly?
Certainly I could bind the functionality directly in the trigger function but this I don’t like to because the function serves for many different occasions and I can not bind all eventualities or do if else etc.
There must be a cool way to do things like these, isn’t there?
Thanks a lot
would be a great help for me also to understand finally the custom event thing.
Hope I explained myself right.
Garavani