Heya all,

Just another tutorial from Meee

this time ill be going threw some of the jQuery usability with you

Firstly let me say im not expert in this i fell i am pretty good so i dont want people commenting about ive use incorrect terms for things etc.....


Lets get started

Ok firstly to me jQuery is like a box and n that box are lots of other boxes... each box can do something to a part of your site weather its a form a table a div it dont matter!

each box within the box is a function and what a function does is perform a set of javascript on a selection of your site, the selection is also called an element!

.................

jQuery is a function itself and the function is know as $ "doller sign"

ok lets get into some jQuery

PHP Code: 

/*make sure jquery is loaded into your site before you perform any off the below code*/

/*
  In javascript you shauld always make sure the document/page is fully loaded and ready,
  this basically means when the DOM is fully compiled where ready! and we do this by the blow code
*/


$(document).ready(function(){

});


/*
  Explaination:
  The first symbol is the $ and this is jquery functiom
  The next slice is (document) and this is what im telling jquery im using NOTE: $(item)
  Now i have passed the document object into jquery i want to run a function on it witch is where the . comes in
  $(document).ready() The .ready() is a function that will be run on document and takes 1 parameter witch is whats known as a callback function!
*/ 
Ok so the above we have established that $ jquery will run the function ready() on document and then run the parameter/function i spicify in the () of ready()


ok we established how jquery runs functions on certain objects/id/classes we tell it to lets play around with a little css

PHP Code: 
$(document).ready(function(){
    /*Jquery is loaded and the document is ready to be manipulated */
    //Lets grab the div below and run the hover function on it
    $('#KWWHunction').hover(
        function(){ /*this function will be run when the mouse is over the div*/
            /*Theres a special variable you can use in functions like this that is the element of the div and its called this*/
            $(this).css('background-color','green')
        }
        function(){/*this function will be run when the mouse is NOT over the div*/
             $(this).css('background-color','redd')
        }
    )
});

/*Header*/
   <div id="KWWHunction">This is a div container on your site</div>
/*Footer*/ 
ok by reading the above you should be able to understand what is going on as its plain and simlple JS but if you dont then not to worry just ask KWWHunction users! meh i rulez... ask me

Ok thats the end of this tutorial and i hope you now know how to use jquery basics and make sure you check out the jquery documentation for examples and other wicked functions packed into it!!!
litewarez Reviewed by litewarez on . Introduction to jQuery Heya all, Just another tutorial from Meee :D this time ill be going threw some of the jQuery usability with you Firstly let me say im not expert in this i fell i am pretty good so i dont want people commenting about ive use incorrect terms for things etc..... Lets get started Rating: 5