JQuery

to merge with JS scripts

General

• jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.

• jQuery - Docs Main Page
  • jQuery UI - jQuery's visual controls. jQuery UI features a wide range of core interaction plugins as well as many UI widgets. The project homepage is located at jqueryui.com. Please visit these pages for downloading UI and many demos.

• Tutorials: How jQuery Works
• Tutorials: Getting Started with jQuery

• The Basics of jQuery February 28th 2012
• jQuery By Example - blog

• jQuery Fundamentals is designed to get you comfortable working through common problems you'll be called upon to solve using jQuery. To get the most out of this site, you'll want to read the content and try the various interactive examples. Each chapter will cover a concept and give you a chance to try example code related to the concept.
• http://ejohn.org/blog/selectors-in-javascript - history

• http://zeptojs.com/ - jqueryapi but lighter

News

• jQuery.Buzz() - Latest jQuery news & resources

API

• jQuery API Documentation
  • CSS

• jQAPI - Alternative jQuery Documentation.
• jQuery 1.8 API Cheat Sheet
• jQuery source viewer - check method implementations easier

• http://www.jsrosettastone.com/

Dimensions

• http://api.jquery.com/category/dimensions/

Development

• Get jQuery Selector Path

• http://www.jquerytools.org/download/

var jq = document.createElement('script');
jq.src = "http://code.jquery.com/jquery-latest.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
jQuery.noConflict();

Plugins

• jQuery Plugin Registry

• http://jquery.malsup.com/
• http://iwantaneff.in/repo/
  • https://github.com/higgo/handpicked.jquery.plugins.repo
  • http://forum.jquery.com/topic/the-handpicked-jquery-plugins-repository

to sort

• https://github.com/dbushell

jQuery UI

• jQuery UI provides abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications.

Images

• http://lenticular.attasi.com/

• https://github.com/t3hprogrammer/flipgrid.js

• http://srobbin.com/jquery-plugins/backstretch/ - a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element

Lightbox

• http://fancyapps.com/fancybox/

Graphs

• http://omnipotent.net/jquery.sparkline

Table

• http://handsontable.com/

Layout

• http://masonry.desandro.com/
• http://isotope.metafizzy.co/
• http://www.wookmark.com/jquery-plugin

• https://github.com/tsvensen/equalize.js

• http://webpop.github.com/jquery.pin/

• http://xoxco.com/projects/code/breakpoints/
• http://responsive-slides.viljamis.com/
• http://www.zurb.com/playground/responsive-tables

• http://fitvidsjs.com/

Popup

• http://labs.voronianski.com/jquery.avgrund.js

Navigation

• http://tinynav.viljamis.com/

Tooltips

• qTip2 - Pretty powerful tooltips

• http://getwordsmith.co/

• http://trentrichardson.com/Impromptu/ - for tutorials

Textarea

• https://github.com/IceCreamYou/jQuery-Autogrow

Animation

• http://gsgd.co.uk/sandbox/jquery/easing/

• jRumble is a jQuery plugin that rumbles, vibrates, shakes, and rotates any element you choose. It's great to use as a hover effect or a way to direct attention to an element.

• http://davidcrawford.github.com/typist-jquery/

Carousel

• http://fredhq.com/projects/roundabout
  • https://github.com/fredhq/roundabout

$("ul#roundabout").roundabout({
   autoplay: true,
   autoplayInitialDelay: 2000
});

The above works only for the first instance. Use window.setTimeout to alter further IDs. [1]

• https://github.com/p-m-p/jquery-box-slider

Scroll to anchor

• https://github.com/JamyGolden/PlusAnchor/
  • http://css-plus.com/2010/11/create-a-scrolling-anchor-link-with-jquery/

$('body').plusAnchor({
  easing: 'swing',
    // The easing method, defaults are 'swing' and 'linear'.
    // Anything else  requires the easing.js plugin
  speed:  1000
    // The amount of time, in milisecons, it takes to complete a transition
});

• https://github.com/djpate/jSlideto/tree/master/js
  • http://djpate.com/2011/01/01/animated-scrollto-effect-jquery-plugin/

$("#someDiv").slideto({
  highlight_color: 'blue',
  highlight_duration: 'slow',
  slide_duration: 500
});

• http://webdesignerwall.com/tutorials/scrollto-posts-with-jquery [2]
• https://github.com/litera/jquery-scrollintoview
  • http://erraticdev.blogspot.com/2011/02/jquery-scroll-into-view-plugin-with.html

$("some_selector").scrollintoview({
   duration: 2500,
   direction: "vertical",
   complete: function() {
     // highlight the element so user's focus gets where it needs to be
   }
});

• http://archive.plugins.jquery.com/project/ScrollTo [3]
  • http://flesler.blogspot.com/2007/10/jqueryscrollto.html
  • http://demos.flesler.com/jquery/scrollTo/
  • http://webdesignerwall.com/tutorials/scrollto-posts-with-jquery

$(...).scrollTo( 'li:eq(15)', 1000, {offset: {top:-5, left:-30} });

• jQuery Smooth Scrolling Internal Links

• jquery-smooth-scroll

$('a').smoothScroll();
$('#container a').smoothScroll();
$('#container a').smoothScroll({excludeWithin: ['.container2']});
  exclude links if they are within a containing element: 
$('a').smoothScroll({exclude: ['.rough','#chunky']});
  exclude links if they match certain conditions
$('.backtotop').smoothScroll({offset: -100});
  adjust where the scrolling stops
$('a').smoothScroll({afterScroll: function() { alert('we made it!'); }});
  add a callback function that is triggered after the scroll is complete 

{
  offset: 0,
  direction: 'top', // one of 'top' or 'left'
  scrollTarget: null, // only use if you want to override default behavior
  afterScroll: null, // function to be called after scrolling occurs. "this" is the triggering element
  easing: 'swing',
  speed: 400
}

Scroll with page

• http://css-tricks.com/scrollfollow-sidebar/
• http://stackoverflow.com/questions/2177983/how-to-make-div-follow-scrolling-smoothly-with-jquery
  • http://jsfiddle.net/VEsdu/
  • http://jqueryfordesigners.com/fixed-floating-elements/

• http://www.hawkee.com/snippet/9445/

Scrolling and parallax

• jScroll is a jQuery plugin that keeps an element in view when a user scrolls. [4]
  • https://github.com/wduffy/jScroll

• http://joelb.me/scrollpath/ - define custom scroll paths
  • https://github.com/JoelBesada/scrollpath

• http://www.ianlunn.co.uk/plugins/jquery-parallax/
  • https://github.com/IanLunn/jQuery-Parallax

• http://johnpolacek.github.com/scrollorama/
  • https://github.com/johnpolacek/scrollorama

• http://johnpolacek.github.com/scrolldeck.js/

• http://imakewebthings.github.com/deck.js/

• http://lab.hakim.se/reveal-js/

• http://markdalgleish.com/projects/stellar.js - not so good in chrome?
  • https://github.com/markdalgleish/stellar.js

• http://www.sequencejs.com/

• http://www.infinite-scroll.com/

• http://www.devinrolsen.com/jquery-zlayers-parallax-plugin/

• http://www.kalyani.com/2010/10/subway-map-visualization-jquery-plugin/

• http://airbnb.github.com/infinity/

• http://web-features.net/

Injection

• DiceJS (dynamically injected css engine) is a jQuery extension that allows you to store your CSS in JavaScript objects to dynamically manipulate and inject as you please.

Feedback

• https://github.com/siong1987/jquery.feedback

Introduction overlay

• http://eragonj.github.com/Trip.js/

• http://heelhook.github.com/chardin.js

Forms

• http://harvesthq.github.com/chosen/ - A library for making long, unwieldy select boxes more user friendly, for jQuery and Prototype

• http://elclanrs.github.com/jq-idealforms/

Typography

• http://www.frequency-decoder.com/demo/slabText/ - scaling headline text

• http://letteringjs.com/ [5]
• http://www.kernjs.com/

• https://github.com/scottgonzalez/figlet-js

• https://github.com/zachleat/BigText

Time

• Timeago is a jQuery plugin that makes it easy to support automatically updating fuzzy timestamps (e.g. "4 minutes ago" or "about 1 day ago").]

Waypoints

Actions on certain areas of the page.

• http://imakewebthings.github.com/jquery-waypoints
  • https://github.com/imakewebthings/jquery-waypoints

Footnotes

• https://github.com/davesnitty/footnoter

Video

• http://dfcb.github.com/BigVideo.js/

• http://videojs.com/
  • http://daverupert.com/2012/05/making-video-js-fluid-for-rwd/

Shadows

• http://indamix.github.com/real-shadow/

Twitter

• https://github.com/divshot/tweetscroller

RSS

• zRSSFeed - will read RSS feeds from any website URL using the Google Feeds API. It produces structured HTML with in-built CSS classes for styling.

• FeedEk is a RSS/ATOM Feed Reader/Importer/Parser that is written with jQuery. You can obtain feeds easily from any domain.
  • https://github.com/enginkizil/FeedEk
  • https://github.com/ArthurAssuncao/FeedEk