Best jQuery Core Java Script Plugins & Tutorials with Demo

Ranger.js : JavaScript library for Ranges of Numbers

Ranger.js : JavaScript library for Ranges of Numbers

Ranger.js is a small, standalone library for working with ranges of numbers in Javascript.

Ranger provides all the utility methods you’d expect, including clampwrapmap, and random. These methods are available statically, as well as through a Range object that can be instantiated for repeated use.

Ranger’s main feature is the ability to provide a ‘curve’ function to certain methods, which will affect how numbers are distributed.

LayerJS: Javascript UI Composition Framework

LayerJS: Javascript UI Composition Framework

layerJS is an open source Javascript UI/UX library allowing intuitive, visually intense, mobile app-like experiences for web apps and websites.

layerJS follows the idea that any kind of interactive web content is composed of media elements on moving layers. Unlike existing UI frameworks, layerJS does not provide various UI elements (use your favorite framework for that) but focusses on how larger blocks are put together to form websites and apps and how these blocks will behave upon user interaction.

UX patterns like menus, sliders, layers & lightboxes, parallax effects, page-swipes, zoom effects, etc. are really justinteractive animated layers. layerJS is a simple open source library that provides one simple universal concept to create such patterns in pure HTML.

Impact : HTML5 Canvas & JavaScript Game Engine

Impact : HTML5 Canvas & JavaScript Game Engine

Impact is a JavaScript Game Engine that allows you to develop stunning HTML5 Games for desktop and mobile browsers.

Curtains.js : Animated WebGL Textured Planes JavaScript library

Curtains.js : Animated WebGL Textured Planes JavaScript library

Curtains.js is a lightweight vanilla WebGL javascript library that turns HTML elements into interactive textured planes, allowing you to animate them via shaders.
You can define each plane size and position via CSS, which makes it super easy to add WebGL responsive planes all over your pages.

Ideas for Proximity Feedback with Progressive Hover Effects

Ideas for Proximity Feedback with Progressive Hover Effects

Today we’d like to share some subtle proximity feedback ideas with you. We’re exploring a progressive hover effect which triggers not just when we are hovering an element but progressively, when we come close to it. There are several interesting use cases for this kind of effect and today we wanted to showcase some of them.

Bubbly-bg : Beautiful Bubbly backgrounds with JS & Canvas

Bubbly-bg : Beautiful Bubbly backgrounds with JS & Canvas

Bubbly-bg is a beautiful bubbly backgrounds in less than 1kB (750 bytes gzipped).

Bubbly creates a canvas element and appends it to the body. This element has position: fixed and z-index: -1, and always fills the width/height of the viewport, which should make it plug and play for most projects.

js2flowchart.js : Beautiful SVG Flowchart Library

js2flowchart.js : Beautiful SVG Flowchart Library

js2flowchart – a visualization library to convert any JavaScript code into beautiful SVG flowchart. Imagine a library which takes any JS code and generate SVG flowchart from it, works on client and server. Allows you easily adjust styles scheme for your context or demonstrate your code logic from different abstractions levels. Highlighting, destructing whole blocks, custom modifiers for your needs etc.

 

Multi.js : User-friendly jQuery Select Box

Multi.js : User-friendly jQuery Select Box

Multi.js is a user-friendly replacement for select boxes with the multiple attribute. It has no dependencies, is mobile-friendly, and provides search functionality. multi.js is also easy to style with CSS and optionally supports jQuery.

JavaScript Lightweight Modern Drag & Drop Libarary : Draggable JS

JavaScript Lightweight Modern Drag & Drop Libarary : Draggable JS

Draggable is a modular drag & drop library, allowing you to start small and build up with the features you need. At its most basic, Draggable gives you drag & drop functionality, fast DOM reordering, accessible markup, and a bundle of events to grab on to.

Features:

  • Works with native drag, mouse, touch and force touch events
  • Can extend dragging behaviour by hooking into draggables event life cycle
  • Can extend drag detection by adding sensors to draggable
  • The library is targeted ES6 first

ECharts : Interactive Charting & Visualization Library

ECharts : Interactive Charting & Visualization Library

ECharts is a free, powerful charting and visualization library offering an easy way of adding intuitive, interactive, and highly customizable charts to your commercial products. It is written in pure JavaScript and based on zrender, which is a whole new lightweight canvas library.