jQuery: Selectors, Methods, Effects

This video tutorial shows the basics of jQuery Selectors, Methods and some nice little image and text effects.

It’ll be fun..

Note:
$(); is a shortcut to $jQuery(); and it’s called Selector.
Its used to select id’s, class, elements.

Selecting id’s, classes and elements is similar to that of CSS Selectors.
For id use # symbol.
For Class use . symbol.
For tags or elements, use tag name or element name.

jQuery Example Code:

1
2
3
4
5

 $(document).ready( function() {
    $("p").click( function() {
      $("img").fadeOut("slow");
  });
});

Once the document is ready or loaded and the user clicks on paragraph text, the image slowly fades out. Simple.

Video Tutorial: jQuery: Selectors, Methods, Effects

Other methods / effects to try ..

.slideUp();
.slideDown();
.slideToggle();

.fadeIn();
.fadeOut();
.fadeTo();
.fadeToggle();

$(“p”).hide(“fast”);
$(“p”).show(“slow”);
$(“img”).slideUp();
$(“p”).html(“Replacement String”);

We’ll come up with some more video tutorial ..stay subscribed, and try these fun program yourselves too.

Also share how you’re using jQuery in your projects and what you actually want to accomplish using it.

Sign into our forum and start discussing various jQuery and other topics and share your ideas and learn more collectively.

If you were not able to execute the above program, then need not worry, just search on our blog and you’ll find full detailed video tutorial writing and executing it step-by-step.
Hope you’re enjoying it.