All posts in Core Java Script

Snap.js : A Library for creating beautiful mobile shelfs in Javascript

Snap.js : A Library for creating beautiful mobile shelfs in Javascript

A Library for creating beautiful mobile shelfs in Javascript (Facebook and Path style side menus)

Features:

  • Firefox 10+, Wide Webkit Support (Android WebKit 2.3.X+)
  • Library Independent
  • High Customization
  • Flick Support
  • User Intent Detection
  • Event Hooks
  • CSS3 Powered Animations
  • Drag Support
  • Programatic API
  • “No-Drag” Elements
  • Definable Easing Mode
  • Enable/Disable Events
  • Disabled Sides (left or right)

Slide and Push Menus in CSS & JavaScript

Slide and Push Menus in CSS & JavaScript

A set of fixed menus that will slide out from any of the edges of the page. The two menus that slide out from the left and right side can also be used in combination with the body moving to the left or right side, respectively, hence being “pushed”.

There are examples of how to trigger the opening and closing of the menus and some example media queries.

Zebra : HTML5 Canvas Rich UI JavaScript Library

Zebra: Desktop-Like User Interface With HTML5 Canvas

Zebra is a javaScript library that follows easy OOP concept, provides HTML5 Canvas based Rich UI and includes Java to JavaScript converter tool .The approach sits on top of HTML5 Canvas element what makes possible to render any imaginable UI. Zebra development is much closer to software engineering where you write well structured, supportable, extendable code basing on easy Zebra OOP concept. You keep distance from the mess of HTML, JavaScript code, CSS and DOM manipulation. Zebra is pure WEB based alternative to Flash or Applet technologies that doesn’t require a plugging on a client side to be installed. In the same time Zebra utilizes power, simplicity and beauty of JavaScript coding.

Features:

  • Over 30 UI components
  • Customizable look and feel (theme support)
  • Flexible layouts
  • Declarative JSON-based UI
  • Easily extendable

Bespoke.js : DIY Presentation Micro-Framework

Bespoke.js : DIY Presentation Micro-Framework

Bespoke.js provides the foundation, then gets out of your way so you can focus on uniquely crafting your own personal deck style.Using keyboard and touch events, Bespoke.js adds classes to your slides, while you provide the CSS transitions.

With its robust plugin system, new functionality can be added to Bespoke.js easily.

Pure : Ultra-fast templating tool
 to generate HTML from JSON data

Pure : Ultra-fast templating tool
 to generate HTML from JSON data

Simple and ultra-fast templating tool to generate HTML from JSON data.The representation (HTML) and the logic (JS) remain totally separated.

Google Maps Events

Google Maps Events

“Google Maps Events” is a nice way for show locations info when click on map’s markers. The script using XML files for show the information for each location. You can show the information in an accordion menu, in tabs menu, as modal window or in a simple div in any area of your pages! You can add the location coordinates in XML file or get the coordinates by address (geocoding)! The script coming with 24 demos and a useful tool for find the coordinates by address!

Features:

  • Edit a XML file for set your information and map settings
  • You can using coordinates or address for set the markers on map
  • Show the location’s info in accordion, tabs, modal window or simple div
  • Show polylines, directions or just the markers on map
  • Styling polylines and directions lines (color, opacity, symbols like arrows etc)
  • You can use different markers (icons and dimensions) for each location in the same map
  • Editable tooltip when you put the mouse over a marker
  • Nice scrollbars for tabs and text (when are bigger than div’s height)
  • Complete documentation with step by step instructions
  • You can change the style very easy with simple CSS

intro.js : JavaScript step-by-step guide for your projects

intro.js : JavaScript step-by-step guide for your projects

A better way for new feature introduction and step-by-step users guide for your website and project.

Countable.js : live word-counting in JavaScript

Countable.js : live word-counting in JavaScript

Countable is a JavaScript function to add live paragraph-, word- and character-counting to an HTML element. Countable does not rely on any libraries and is very small in size.

Countable takes the value from an HTML element and counts paragraphs, words and characters (without and with spaces). Those numbers are then returned in an object, accessible by a single parameter in the callback function.

CSS Arrow Please : Generate CSS tooltip arrows with JavaScript

CSS Arrow Please : Generate CSS tooltip arrows with JavaScript

Generate the CSS for a tooltip arrow with the help of javascript

Unlimited Grid Layout in CSS & JavaScript

Unlimited Grid Layout in CSS & JavaScript

During my work as a frontend developer I coded many sites with a full page layout, both before and after the Flash decline.

Coding this type of layout was, every time, one step forward towards a better and more maintainable CSS structure; however, even if every single length was expressed as a relative and flexible unit, we need to know the number of pages.

For example: if we have an horizontal structure of 6 pages we set the pages’ container width to 600% and every single child page width to 16.66%. But if the number of pages changed to 5 or 7 we have to edit the CSS.



Best jQuery websites design awards