Forum for Digital Media Arts (DMA) Students & Alumni
Home­Register­Gallery­FAQ­Search­Memberlist­Usergroups­Log in
Post new topic   Reply to topicShare | 
 

 Intro to JQuery

View previous topic View next topic Go down 
AuthorMessage
jorgelopez



Posts: 26
Join date: 2009-01-18
Age: 23

PostSubject: Intro to JQuery   Thu Sep 10, 2009 5:15 pm



JQuery is a Javascript library that defines functions in order to facilitate working with javascript. I fixes the many browsers inconsistencies too. It has to developed into a very popular library today. It has a huge community of developers using it and supporting it.
JQuery
1. In order to use the Library you will have to include it in your documents as so:
<script type=”text/javascript” src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

2. Jquery defines a function that gets executed when the whole page has loaded called ready(). It works like this:
Code:
<script type="text/javascript">
   $(document).ready(
      function(){
         alert("the page has loaded");
}
);
</script>

1st you get a reference to the document and add the ready event to it. Once the document has loaded, the code inside the function gets executed.

Getting Reference to an HTML Element
Jquery has a function called $(). This function acts like the getElementById() function. The difference is that $() is more powerful. You can get reference of an element by its ID, Class, tag. If a button has an ID of ‘myButton’, you would get a reference like so: $(‘myButton’).

Jquery Effects
Jquery has many effects built in. Jquey has a Fade, sliding, basic. Check out all of the effects here: http://docs.jquery.com/Effects. Example:
Code:
<script type="text/javascript">
   $(document).ready(
      function(){
         $("#myContent").click(
   function(){
   $("#myContent").slideDown("slow");
}
);
}
);
</script>


JQuery is an all powerful tool. It can handle Ajax, Css styling and effects. Check out the whole documentation. It is very easy to use. Just remember use effects to enhance the user’s experience and don’t over do it.

Example:
http://jorge-portfolio.com/tutorials/jqueryexample.html
Back to top Go down
View user profile
 

Intro to JQuery

View previous topic View next topic Back to top 
Page 1 of 1

Permissions of this forum:You cannot reply to topics in this forum
Digital Media Arts (DMA) :: Software :: Coding/Scripting-
Post new topic   Reply to topic