Fancy SVG Letter Animation

Fancy SVG Letter Animation

Today we’d like to show you a fancy little lettering animation made with SVG and anime.js. The idea is inspired by Jake Bartlett’s gorgeous opening animation for the “Shading Letters in Illustrator” Skillshare class by Jamie Bartlett. While we didn’t do any shading, we wanted to animate the stroke of each letter multiple times to achieve a similar effect.

TabSlideOut.js : jQuery plugin to Create a side/top/bottom Tab

TabSlideOut.js : jQuery plugin to Create a side/top/bottom Tab

jQuery plugin to create tabs that slide out from the window edges to show a feedback form, contact form, notepad etc.

Includes methods to programmatically interact with tabs, and events and handlers fire on open, close and bounce (bounce is used to attract attention to a tab).

Zingtouch : JavaScript Gesture Detection Library

Zingtouch : JavaScript Gesture Detection Library

A modern JavaScript touch gesture library. Allows developers to configure pre-existing gestures and even create their own using ZingTouch’s life cycle.

ZingTouch is built to make implementing gestures for the browser as easy or complex as you need it to be. ZingTouch comes with 6 main gestures :

  • Tap
  • Swipe
  • Pinch
  • Expand
  • Pan
  • Rotate

Ultimate Styleswitcher Framework with jQuery

Ultimate Styleswitcher Framework with jQuery

Ultimate Styleswitcher is style switch framework built for designers and developers, or anyone else who have made some awesome template, plugin, etc. and now need some creative way to display all the possibilities of his/her latest project.

Tiva Timetable : jQuery Events Calendar

Tiva Timetable : jQuery Events Calendar

Tiva Timetable is a responsive schedule javascript library with clean and modern flat interface. It is very easy to use yet gives plenty of features and styling options. You can use it for any kind of schedule or events calendar.

There are 3 layouts for your choice: monthly view, weekly view or list view. You can manage timetables in json file or feed from your database via php file with ajax technique.

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.