Facebook Style Background Image Upload and Position Adjustment

Facebook Style Background Image Upload and Position Adjustment

In this tutorial we will learn how to design Facebook style ajax background image upload and position adjustment using Jquery. I have been published many tutorials about ajax image upload, this one is very interesting and it is a combination of many features. I has implemented this in Wall Script, this post will explain you how to design timeline HTML frame, CSS techniques and database design for background image system.

Creative Gooey Effects with SVG

Creative Gooey Effects with SVG

Today we are going to show how to use SVG Filters to apply a gooey-like effect to HTML elements. We’ll first cover some basics of the technique and then we’ll demonstrate several creative use cases for common website elements, like menus, apps, selections, paginations and more.

Pixie : JavaScript Image Editor

Pixie : JavaScript Image Editor

Pixie is a online javascript image editor script that can easily crop, rotate, resize, zoom and round your images corners right from your browser and then save it to your computer.

  • Easily crop, rotate, resize, zoom
  • Free Drawing Mode
  • Add Text to Images
  • Apply Multiple Image Filters
  • Draw and Add Various Shapes
  • Choose from 100s of Stickers
  • Layers and History Management
  • HTML5, No Flash Required

SiteHelp.js : jQuery plugin for Interactive Site Help

SiteHelp.js : jQuery plugin for Interactive Site Help

SiteHelp.Js is a very helpful Javascript plugin made using jQuery to provide interactive site help. Sometimes it happens that a user visits a webpage and he totally helpless as where to navigate next. SiteHelp.js helps such users by navigating them to the important sections or html elements of a website and provide some help guidelines which they could have missed otherwise. It simply creates a virtual tour of the website.

jQuery Ajax Auto-complete Combobox

jQuery Ajax Auto-complete Combobox

A jQuery plugin for creating a text box it can auto-complete and pull-down-select.

Glfx.js : JavaScript Image effects library using WebGL

Glfx.js : JavaScript Image effects library using WebGL

Adjust photos in your browser in realtime with glfx.js, an image effects library powered by WebGL. It uses your graphics card for image effects that would be impossible to apply in real-time with JavaScript alone.This library provides realtime image effects using WebGL. There are three parts to glfx.js:

  • texture: a raw source of image data (created from an <img> tag)
  • filter: an image effect (represents one or more WebGL shaders)
  • canvas: an image buffer that stores the results (a WebGL <canvas> tag)

jQuery ScrollSpeed : Custom Scrolling Speed and Easing

jQuery ScrollSpeed : Custom Scrolling Speed and Easing

Lightweight jQuery extension for modifying scrolling speed in modern web browsers. Supports vertical or horizontal scrolling direction, including user-defined easing.

CSS effects for Notifications using Animate.css

CSS effects for Notifications using Animate.css

This tutorial is aimed to show you some very common CSS transitions used in development. I chose to illustrate this on notifications because i can use the both hidden and visible states of elements to display a broad range of animations.

Bootstrap Dropdown Filter for jPList Library

Bootstrap Dropdown Filter for jPList Library

Bootstrap Dropdown Filter is a control for jPList, an open source library for sorting, filtering and pagination. It allows filtering of any HTML structure (DIVs, UL/LI, Tables etc.) by the given jQuery path and uses a standard Bootstrap dropdown component for layout.

Features:

  • Filter any HTML structure by jQuery path
  • Supports local storage and cookies
  • Supports deep links
  • Fully customizable styles

Boids.js : Javascript library allows you to Control Boids

Boids.js : Javascript library allows you to Control Boids

A Javascript library allows you to control boids such as bird flock and fish school. This computer model of coordinated animal motion was designed by Craig Reynolds in 1986. This model consists of three simple rules which are separation, alignment and cohesion.