WebGazer.js: Scalable Webcam EyeTracking Using User Interactions

WebGazer.js: Scalable Webcam EyeTracking Using User Interactions

WebGazer.js is an eye tracking library that uses common webcams to infer the eye-gaze locations of web visitors on a page in real time. The eye tracking model it contains self-calibrates by watching web visitors interact with the web page and trains a mapping between the features of the eye and positions on the screen.

Features:

  • Real time gaze prediction on most major browsers
  • No special hardware – WebGazer.js uses common webcams
  • Self-calibration from clicks and cursor movements
  • Easy to integrate with a few lines of JavaScript
  • Swappable components for eye detection
  • Multiple gaze prediction models

3D Portfolio Template in CSS & jQuery

3D Portfolio Template in CSS & jQuery

A portfolio template, with a filter that triggers the rotation of 3D sections.

CSS 3D Transforms can be used in plenty of creative ways, particularly if combined with CSS Transitions! Today’s nugget is a good example of how to use CSS to create a parallelepiped, whose faces are different projects. A filter on top of the page triggers the 3D rotations that reveal new projects.

Cleave.js : Javascript Library to Format Input Text Content

Cleave.js : Javascript Library to Format Input Text Content

Cleave.js has a simple purpose: to help you format input text content automatically.

  • Credit card number formatting
  • Phone number formatting (i18n js lib separated for each country to reduce size)
  • Date formatting
  • Numeral formatting
  • Custom delimiter, prefix and blocks pattern
  • CommonJS / AMD mode

Adapttext.js : jQuery Responsive Text Plugin

Adapttext.js : jQuery Responsive Text Plugin

Adapttext.js is a dependency free and simple javascript solution capable to fit your text inside the parent element.

It calculates the maximum font-size possibile in order to keep the text’s width and height inside the parent.

It’s very useful in responsive situation and where we don’t know in advance the text’s length (text pulled from a CMS?). It is also very handy when we need to display text along an image and we want to avoid overlaps.

Add And Remove File Fields Using jQuery And PHP

Add And Remove File Fields Using jQuery And PHP

In this tutorial we will show you how to add and remove file fields using jQuery and PHP.Now user can add any number of file fields he wants by clicking on a single button and upload multiple files using PHP.

bwip.js : Barcode Writer in Pure JavaScript

bwip.js : Barcode Writer in Pure JavaScript

bwip-js is a translation to native JavaScript of the amazing code provided in Barcode Writer in Pure PostScript. The translated code can run on any modern browser or JavaScript-based server framework.

The software has encoding modules for over 90 different barcode types and standards. All linear and two-dimensional barcodes in common use (and many uncommon ones) are available.

Barba.js : Fluid and Smooth Transition Between Websites Pages

Barba.js : Fluid and Smooth Transition Between Websites Pages

Barba.js is a small, flexible and dependency free library that helps you creating fluid and smooth transitions between your website’s pages.

It helps reducing the delay between your pages, minimizing browser HTTP requests and enhancing your user’s web experience.

Features:

  • Pjax
  • Transitions
  • Views
  • Events
  • Cache
  • Prefetch

BootstrapX Clickover : jQuery Bootstrap Click Managed Popovers

BootstrapX Clickover : jQuery Bootstrap Click Managed Popovers

BootstrapX Clickover provides a Bootstrap extension to allow popovers to be opened and closed with clicks on elements instead of hover or focus.

jQuery Scroll to Top – 32 Animations

jQuery Scroll to Top - 32 Animations

Scroll to top is a multi-purpose, fully responsive scroll to top button which allows you to scroll to the top of the website with silky-smooth animation (32 animation types). Release you users from endless scrolling back to top with this one click add-on.

Based on HTML5 & CSS3 to deliver best user experience on any smartphone, tablet and notebook/desktop computer.

 

  • 32 animation effects
  • 8 predefined, awesome color themes
  • 6 button positions
  • 4 button layouts
  • responsive
  • CSS3 animated button
  • Font Awesome
  • cross browser support
  • 100% Bootstrap compatible

 

Draggable Google Modal with Pure JavaScript

Draggable Google Modal with Pure JavaScript

Simple draggable modal with pure Javascript, inspired by Google Modal.

Features:

  • Without external dependencies.
  • Drag and Drop
    • When is fixed, the drag is disabled.
  • Responsive
  • Shortcuts
    • Ctrl + Up Arrow: Fill the entire screen;
    • Ctrl + Down Arrow: Exit full screen;
    • Ctrl + Left Arrow: Align the left, filling half the screen*;
    • Ctrl + Right Arrow: Align the right, filling half the screen*;