Move document.ready function to a separate javascript fucntion?

Question

Hi,

Is it possible to move the following code within a jQuery document.ready function into a separate javascript function, so that it can be called just like any other javascript function, i.e.:

<script type="text/javascript"> 
$(document).ready(function()
{
   $('div#infoi img[title]').qtip({
      position: { 
         adjust: { x:-110, y:0 },
         corner: {
            target: 'bottomLeft',
            tooltip: 'topMiddle'
         }
      },
      style: {
        width: 250,
        padding: 5,
        background: '#E7F1FA',
        color: 'black',
        textAlign: 'center',
        border: {
          width: 3,
          color: '#65a9d7'
        },
        tip: 'topRight'
      }
   });
});
</script>

If yes, then how - if not, then that answers my question.

Thanks.

Answer 1

It is certainly possible - you would just have to make sure the document is fully loaded at the point you call that function! Also, I'm not sure why this would make sense, seeing as you seem to be initializing a tooltip?

As to how, just replace

$(document).ready(function()

by

function my_function_name()

Answer 2

Pekka's answer is correct, but you may want some other info, e.g. how to call it, so for example if we have this currently:

$(document).ready(function() {
  alert("DOM Ready!");
});

Then put it in a named function instead, like this:

function myFunc() {
  alert("DOM Ready!"); 
}

Now you can call it using myFunc() anywhere...if you still want to call it on document.ready as well, the syntax is very short, like this:

$(myFunc);
//this is equivalent to:
$(document).ready(myFunc);

Basically wherever you have an anonymous function() { }, you can name it a named function outside there and call it by name as I have above, the .ready(myFunc) could easily be $("#thing").click(myFunc) for example :)