Skip to content

Instantly share code, notes, and snippets.

@dergachev

dergachev/jquery-tutorial.md

Last active December 14, 2015 13:18
Download ZIP

Revisions

  1. dergachev revised this gist Mar 5, 2013. 1 changed file with 2 additions and 5 deletions.
    7 changes: 2 additions & 5 deletions jquery-tutorial.md
    View file
    Original file line number Diff line number Diff line change
    @@ -33,10 +33,7 @@ logo.href='http://drupal.org';
    console.log(logo.href);
    ```

    ## Examples
    ## Example

    * https://gist.github.com/dergachev/50802f9e6b80e7428e9d#jquery-snippet-replaces-all-site-images-with-conservative.ca-logo.
    * http://interactingwithprint.org/
    * see http://interactingwithprint.org/sites/all/modules/custom/iwp_mod/js/iwp-mod.js
    * http://bipinterpret.com/
    * see http://bipinterpret.com/sites/all/themes/bip_theme/js/script.js
    * see http://interactingwithprint.org/sites/all/modules/custom/iwp_mod/js/iwp-mod.js
  2. dergachev revised this gist Mar 5, 2013. 1 changed file with 9 additions and 9 deletions.
    18 changes: 9 additions & 9 deletions jquery-tutorial.md
    View file
    Original file line number Diff line number Diff line change
    @@ -1,11 +1,3 @@
    ## Examples

    * https://gist.github.com/dergachev/50802f9e6b80e7428e9d#jquery-snippet-replaces-all-site-images-with-conservative.ca-logo.
    * http://interactingwithprint.org/
    * see http://interactingwithprint.org/sites/all/modules/custom/iwp_mod/js/iwp-mod.js
    * http://bipinterpret.com/
    * see http://bipinterpret.com/sites/all/themes/bip_theme/js/script.js

    ## Slide decks:

    * http://www.slideshare.net/toadh/jquery-tutorial-14977468
    @@ -39,4 +31,12 @@ Without jQuery, get the element with id="logo" and (assuming it's a link) make i
    logo = document.getElementById('logo');
    logo.href='http://drupal.org';
    console.log(logo.href);
    ```
    ```

    ## Examples

    * https://gist.github.com/dergachev/50802f9e6b80e7428e9d#jquery-snippet-replaces-all-site-images-with-conservative.ca-logo.
    * http://interactingwithprint.org/
    * see http://interactingwithprint.org/sites/all/modules/custom/iwp_mod/js/iwp-mod.js
    * http://bipinterpret.com/
    * see http://bipinterpret.com/sites/all/themes/bip_theme/js/script.js
  3. dergachev created this gist Mar 5, 2013.
    42 changes: 42 additions & 0 deletions jquery-tutorial.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,42 @@
    ## Examples

    * https://gist.github.com/dergachev/50802f9e6b80e7428e9d#jquery-snippet-replaces-all-site-images-with-conservative.ca-logo.
    * http://interactingwithprint.org/
    * see http://interactingwithprint.org/sites/all/modules/custom/iwp_mod/js/iwp-mod.js
    * http://bipinterpret.com/
    * see http://bipinterpret.com/sites/all/themes/bip_theme/js/script.js

    ## Slide decks:

    * http://www.slideshare.net/toadh/jquery-tutorial-14977468
    * http://www.slideshare.net/AlmogBaku/drupal-javascript-14718275
    * http://www.slideshare.net/joern.zaefferer/stackoverflow-devdays-jquery-introduction-for-developers

    ## Tutorials:

    * http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery
    * http://www.codecademy.com/courses/web-beginner-en-bay3D
    * http://drupal.org/node/304258#5.-the-drupal-javascript-api

    ## jQuery snippets to run in the console

    Replaces images with conservative.ca logo:

    ```js
    jQuery('img')
    .attr('src','http://www.conservative.ca/wp-content/themes/conservative/images/featureMenu-navMenu-Conservative-en.png')
    ```

    Remove all `li` tags (list-item):

    ```js
    jQuery('li').remove();
    ```

    Without jQuery, get the element with id="logo" and (assuming it's a link) make it pont to drupal.org:

    ```js
    logo = document.getElementById('logo');
    logo.href='http://drupal.org';
    console.log(logo.href);
    ```