How do I get started with jQuery? [closed]


Tags: jquery,css

Problem :

I’m new to jQuery, so I want to know how I can get started with it, or where to start from.

I have good knowledge of HTML, CSS, DHTML and JavaScript.



Solution :

As others have mentioned, there are a bajillion tutorials out there. They're all good choices, but the way I decided to learn was by doing it.

These are the steps I took:

  1. Decide what you want to add to the page using jQuery (specifically look at jQuery UI, maybe accordian, tabs, etc... for examples of what I've done with TABS and jQ take a look at http://itsalldiet.com/tools)

  2. From there, go to the jQueryUI documentation (as mentioned by so many others) but in my example, I'd say go exactly here: http://jqueryui.com/demos/tabs/

  3. Click on "View Source"

  4. Copy and Paste the source onto your own website.

  5. Change it a little to meet your purposes

  6. Decide that it still doesn't quite do exactly what you want it to do

  7. Read about the other options you can play with.

  8. Get close but not quite close enough....

  9. Start reading about accessing the DOM directly and looping through every element on the page using CCS Selector Syntax (it's here: http://www.w3.org/TR/css3-selectors/ once you start to get the hang of it, you're basically a ninja) :

    $('a[href~=foo][display=none]').each(function(a){a.slidetoggle()});

jQuery, as with any new language may seem overwhelming at first. It is, however, once you get the hang of it, quite a bit of fun. I also really like prototype too. You might want to check that one out too.


    CSS Howto..

    How to use particular CSS styles based on screen size / device

    How to make a jQuery script and CSS responsive?

    How to add a ToolTip for an icon inside my CSS file

    express: how to send html together with css using sendFile?

    How we can add a span to a text inside ul, that is outside of li in jquery or css

    How to resize dynamic images coming from database in a responsive bootstrap website

    HTML/CSS: How to make “password” input show the password?

    How can I centre an unordered list of floated items to the page

    How to remove flexbox default padding/margin/pagemargin?

    How do I add a horizontal scrollbar to a table in a div?

    How do i make my nav bar transparent when I scroll down and come back when I scroll up or when I hover my mouse over is?

    How to Use CSS transitions

    How to get rid of this whitespace in internet explorer?

    How to do like this list using
  • and CSS?
  • Contact page Design how to add Bootstrap

    CakePHP: How to use PHP to dynamically use a CSS property type in an MVC framework

    How do I do image color blend in css?

    how to write css to reduce font size [duplicate]

    How do I set a cursor css for text inside li element?

    How to center my

    text using css?

    SCSS / Sass: How do i change a mixin to output specific CSS?

    jquery width toggle animation is showing vertical cells during animation takes place

    How can display these elements in line?

    How do I select a css element with a text not attached to the attribute?

    How to prevent css keyframe animation to run on page load?

    How to use javascript/css to navigate through a pure css carousel/slideshow?

    How to alternate rowcolor in a GridView using pure CSS?

    How to assign CSS to images which have specific extension, height and width?

    CSS - How to set margin-left dynamically with a fixed value

    How to increase Page Width with the Help of CSS?