Mobile Swipe - Swipe Jquery - Mobile Touching

1. http://www.queness.com/post/11069/7-image-sliders-with-responsive-fluid-layout-support
2. http://dimsemenov.com/plugins/royal-slider/
3. http://magazine.nuefolio.com/2011/09/photo-swipe-image-gallery-for-mobile-and-touch-devices/
4. http://freebiesdesign.com/6-best-jquery-images-slider-for-mobile/
5. http://www.photoswipe.com/
6. http://www.jquery4u.com/mobile/10-jquery-mobile-swipe/
7. http://jbkflex.wordpress.com/2012/01/09/replicating-the-swipe-gesture-iphone-gallery-for-mobile-web-html5-part-1/

jQuery Sparklines - The tool draw chart

This jQuery plugin generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript.

The plugin is compatible with most modern browsers and has been tested with Firefox 2+, Safari 3+, Opera 9, Google Chrome and Internet Explorer 6, 7, 8, 9 & 10 as well as iOS and Android.
Each example displayed below takes just 1 line of HTML or javascript to generate.

Link to jQuery Sparklines http://omnipotent.net/jquery.sparkline/#s-about

Example :

<script type="text/javascript" src="jquery-1.7.2.js"></script> 
<script type="text/javascript" src="jquery.sparkline.js"></script> 

<p> Inline Sparkline: <span class="inlinesparkline">5,5,9,10</span>. </p> 

 <script type="text/javascript"> 
 $(function() {   
 $('.inlinesparkline').sparkline('html', {type: 'pie', barColor: 'red'} ); 
 }); </script> 

Pros
Easy to use
A jquery plugin (we are familiar with jQuery)
Free software
Run faster than google chart
Have variety of different charts

Cons
Border not smoothly rounded for pie chart
Cannot add SliceText  (only show Slice's value)
Limited customisation to tool-tip styling

Responsive Frameworks Options Analysis

Overview

We may wish to select a responsive UI framework in order to expedite the creation of our site in a Responsive manner.

Please Note This selection analysis assumes that we will be utilising PHP and the ZEND framework to build this site.

Results

After much deliberation we have chosen to use the latest version of Twitter Bootstap for our needs.
There is not much to separate it from Foundation 3 except for the fact that we have had exposure to it in the past and it seems to have more proven usages in the market.
We will most likely wish to utilise the fluid grid within Twitter Bootstap as I believe this will give us the best results.

Responsive Frameworks

These are some of the frameworks available and their pros and cons.

Twitter Bootstrap - http://twitter.github.com/bootstrap

Pros

 very extensively utilised in the market
 Grids: Fluid and fixed
 12 column layout
 built with LESS that we have had some experience with
 fairly decent UI components also provided
 Fixed widths (724px, 940px, 1170px; below 767px are single column and vertically stacked)
 Devs have had some experience/exposure to it and it is used in Zend 2.0

 Cons

 locks you in a fair bit to using their stuff...
 not as many media queries provided out of the box
 responsive design available to be used but not the default position
 no video scaling.

Foundation 3 - http://foundation.zurb.com/

Pros

 looks quite flexible and moderately utilised
 Fluid grids
 MIT License
 lots of different media query classes sets and CSS classes for showing and hiding visibility on phones and tablets
 also allows for the use of SASS, a powerful CSS preprocessor (www.sass-lang.com)
 also has a bunch of UI components that aren't over powering
 support for video scaling
 Fluid (max-width 100%)

Cons

 quite new
 Dropped IE7 support
 no popovers included in UI components

Foundation 2 - http://foundation.zurb.com/

Pros

 looks quite flexible and moderately utilised
 Fluid grids 
 MIT License
 Fluid (max-width 1200px)

Cons

 older and no longer really supported by zurb
 no video scaling

Skeleton - http://www.getskeleton.com 

Pros

 looks quite flexible and somewhat utilised
 Fixed Grids
 16 column layout
 MIT License
 Base Width 960px

Cons

 still new
 Fixed grids
 very basic UI components provided
 Skeleton template only works up to a 960 pixel width

1140px grid - http://cssgrid.net/

Pros

 allows responsive design for 1140px grid

Cons

 not talked about much, not sure how used it is...
 suited specifically for 1280 monitors
  Creative Commons 3 Licensed http://creativecommons.org/licenses/by/3.0/au/

Less Framework 4 - http://lessframework.com/

Pros

 allows for development of responsive design
 believe it supports LESS CSS which is handy
  MIT licensed (free to use and modify it in any way you want, as long as you keep the license comment at the top of the CSS)

Cons

 It contains 4 default layout types and 3 sets of typography presets, all based on a single grid which we may not want.

Frameless Grid - http://framelessgrid.com/

Pros

 geared towards fixed width grid.

Cons

 adaptive design instead of responsive design...