Showing posts with label Js Libraries. Show all posts
Showing posts with label Js Libraries. Show all posts

iscroll - Javascript Scroller Plugin

iscroll - Javascript Scroller plugin

Recently I have started using iscroll, a javascript scroller. It has got tons of features, a few of which are:
1. Custom events such as onBeforeScrollStart, onScrollStart, onScroll, onScrollEnd, flick, etc.
2. Animation with user defined easing functions, bounce, elastic, etc.
3. Enable/disable scroll bar, fade or style the scroll bar.
4. Programmatic scrolling - scrollTo(x, y, time, easing), scrollBy(x, y, time, easing), scrollToElement(el, time, offsetX, offsetY, easing).

For the full list of configurable options and demo, check out : https://github.com/cubiq/iscroll

Example:

HTML:

<div class="wrapper">
<div class="content"></div>
</div

JS:

// On load
var scrollBar = new IScroll(".wrapper", {
                    scrollX: true,
                    scrollY: true,
                    mouseWheel: true,
                    bounce: true
                });

Object Oriented Javascript using Mozart

Object Oriented Javascript using Mozart

"Do java like programming in javascript." We can develop web applications following OOPs concepts with mozart js. It also helps to develop mvc architecture. Mozart is inheritance library.
It has got following features

  • Simple subclassing.
  • Private and protected methods and properties.
  • Intuitive super method calling.
  • Dynamic getter and setter generation.


Reference: https://github.com/philipwalton/mozart

lodash - JavaScript utility library delivering consistency, modularity, performance,...

lodash - JavaScript utility library delivering consistency, modularity, performance,...


Today I found a js library just like underscore which has got many useful functions. Check it out.

https://lodash.com/

https://lodash.com/docs

http://devdocs.io/lodash-string/


Animate SVG - JavaScript Libraries

Animate SVG - JavaScript Libraries

We can animate svg using javascript and CSS. However I came across some Javascript libraries for animating SVG.

1. snapsvg - http://snapsvg.io/
2. svgjs - http://svgjs.com/
3. Raphael - http://raphaeljs.com/

Javascript Format Date, Number and Currency - Moment.js, Numeral.js and Accounting.js

Format Date, Number and Currency - Moment.js, Numeral.js and Accounting.js

I came to know libraries which help us in formatting numbers, dates and currency.

1. Moment.js - To parse, validate, and format dates.

Examples:
moment().format('MMMM Do YYYY, h:mm:ss a'); // April 4th 2015, 3:11:47 pm
moment().format('dddd');                    // Saturday
moment().format("MMM Do YY");               // Apr 4th 15

// selecting time zone
moment.tz("2015-04-04 11:55", "Indian/Mauritius").format(); // "2015-04-04T11:55:00+04:00"
moment.tz("March 12th 2015 8PM", "MMM Do YYYY hA", "Indian/Mauritius").format();
 // "2015-03-12T20:00:00+04:00"


Url: http://momentjs.com/


2. Numeral.js - To format numbers

Examples:
numeral(10000).format('0,0'); // "10,000"
numeral(10000).format('$0,0');  // "$10,000"
numeral(10000).format('0b'); // "10KB"
numeral(0.10).format('0%'); // "10%"

Url: http://numeraljs.com/

3. Accounting.js - To format numbers, money and currency

Examples:
accounting.formatMoney(1000); // "$1,000.00"

// Indian rupee currency formatting
accounting.formatMoney(1000.99, "₹", 2, ".", ","); // "₹1.000,99"

Url: http://openexchangerates.github.io/accounting.js/