jQuery Way
Upcoming SlideShare
Loading in...5
×
 

jQuery Way

on

  • 1,702 views

Starting jQuery path the right way

Starting jQuery path the right way

Statistics

Views

Total Views
1,702
Views on SlideShare
1,691
Embed Views
11

Actions

Likes
0
Downloads
33
Comments
0

2 Embeds 11

http://ferrymulyono.com 9
http://localhost 2

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    jQuery Way jQuery Way Presentation Transcript

    • jQuery Way Right path to Javascript and jQuery Thursday, September 23, 2010
    • Web Triad Javascript HTML CSS Thursday, September 23, 2010
    • Web Triad jQuery Javascript HTML CSS Thursday, September 23, 2010
    • Structure *http://developer.yahoo.com/performance/rules.html Thursday, September 23, 2010
    • Real Structure Thursday, September 23, 2010
    • jQuery: Start Thursday, September 23, 2010
    • jQuery: Start = Thursday, September 23, 2010
    • jQuery: Start = <img /> <script /> <style /> Thursday, September 23, 2010
    • DOMReady Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) <input id=”txt-email” class=”.input-text” type=”text” name=”email” /> *http://api.jquery.com/category/selectors/ Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) <input id=”txt-email” class=”.input-text” type=”text” name=”email” /> $(‘input’) *http://api.jquery.com/category/selectors/ Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) <input id=”txt-email” class=”.input-text” type=”text” name=”email” /> $(‘input’) $(‘#txt-email’) *http://api.jquery.com/category/selectors/ Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) <input id=”txt-email” class=”.input-text” type=”text” name=”email” /> $(‘input’) $(‘#txt-email’) $(‘.input-text’) *http://api.jquery.com/category/selectors/ Thursday, September 23, 2010
    • jQuery - Selectors $(‘selectors’) <input id=”txt-email” class=”.input-text” type=”text” name=”email” /> $(‘input’) $(‘#txt-email’) $(‘.input-text’) $(‘input[name=email]’) *http://api.jquery.com/category/selectors/ Thursday, September 23, 2010
    • jQuery - What It Can Do? • Event Handler • Traversing • Manipulating • Helper • Effect • AJAX Thursday, September 23, 2010
    • jQuery - Event Handler $(‘selectors’) .click( function() { ... } ); .bind(‘click’, function() { ... } ); .click(someFunction); *http://api.jquery.com/category/events/ Thursday, September 23, 2010
    • jQuery - Traversing $(‘selectors’) .find(‘selectors’); .filter(‘selectors’); .parent(); .parents(‘selectors’) .each(function(index, element) { ... }) *http://api.jquery.com/category/traversing/ Thursday, September 23, 2010
    • jQuery - Manipulating $(‘selectors’) .addClass(‘className’); .removeClass(‘className’); .css(‘name’, ‘value’); .attr(‘name’, ‘value’) .remove() .html(‘<div />) .append(‘<div />’) *http://api.jquery.com/category/manipulation/ Thursday, September 23, 2010
    • jQuery - Helper $(‘selectors’) .hasClass(‘className’); .text(‘textContent’); .val(‘value’); .val() - Returns value Thursday, September 23, 2010
    • jQuery - Effect $(‘selectors’) .show(); .show(‘slow|fast’); .hide(); .toggle() .slideUp() .slideDown() .fadeIn() .fadeOut() *http://api.jquery.com/category/effects/ Thursday, September 23, 2010
    • jQuery - AJAX $.ajax( url: ‘ajax-path’, type: ‘post’, dataType: ‘json’, success: function(data) { // ... } ) Thursday, September 23, 2010
    • jQuery - AJAX $.post(‘ajax-path’, { name: val }, success: function(data) { // ... }, ‘json’ ) Thursday, September 23, 2010
    • $(jQuery).stop(); Facebook: http://facebook.com/ferry.mulyono Twitter: @ferrymulyono Thursday, September 23, 2010