Need help adding $(document).ready(function(){

1

This is the only jquery function I’ve run across that doesn’t begin with

$(document).ready(function(){
   // Your code here
 });

I am running into problems with my script trying to access jquery before the page is ready. I’m getting errors when I add it.

function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
  }
2

jQuery won’t work when it’s not loaded… you need to, at least, call all of your jQuery code from $(document).ready();

http://docs.jquery.com/Tutorials:Introducing_%24(document).ready()

3

[quote=McGuffin;2328936]jQuery won’t work when it’s not loaded… you need to, at least, call all of your jQuery code from $(document).ready();

http://docs.jquery.com/Tutorials:Introducing_%24(document).ready()[/quote]

I know, I’m just not good enough at js to add something to something that works without breaking it, because I never know how many });s I need and randomly adding }; tends to create other syntax errors.

I tried this which broke it and generated a runtime error

  $(document).ready(function(){
  function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
  }
  });

I also tried this which broke it and generated syntax error

  $(document).ready(function(){
    
  function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
 });
4

Just use a text editor and space it out as such:


$(document).ready(function(){
	function tab_change( parent, elm ) {
 		$('#'+parent+' .show')
			.slideUp('fast', function() {
				$('#'+elm).slideDown('normal').addClass('show');
			})
			.removeClass('show')
			.addClass('hide');
	}
});

It’s really not as difficult as you’re making it out to be.

5

tab_change is not defined
onclick(click clientX=0, clientY=0)

Here is the tute I started with [COLOR=#005771]Animated Javascript Tabs in 1 Line of Code[/COLOR]

COLOR=#1872e2 One Line Tabs[/COLOR]

The author has several jQuery entries on his blog, I am starting to wonder if there is a reason why he didn’t begin with

$(document).ready(function(){
// Your code here
});

6

Here is what a javascript expert on another forum told me about why this function does not work with $(document).ready(function() );

You are defining function tab_change WITHIN the function that is executed as soon as the document is ready for DOM manipulation. Basically tab_change is “trapped” within the anonymous function executed by the ready event and as soon as that is done executing, tab_change is no longer visible. You need to define tab_change “outside/indepent of” the anonymous function that is being executed by the ready event.

In case you are wondering what that anonymous function is, basically you are executing this:
jQuery(document).ready( function(){…} );

the function(){…} IS the anonymous function, and in what you currently have you are defining tab_change where the … are. It does NOT exist outside of that function. That’s why when you click on the tabs the function is not found (Hence the reason for the “Object expected” error in IE.