Continuing with the tutorials about AJAX and jQuery we will create a stunning and dynamic shoutbox based in PHP and AJAX (using jQuery).
We will learn how to create a dynamic ajax based shoutbox with jQuery from scratch. It will be very interesting to know how to use the ajax function of jQuery and how it can be used to insert and recoverdata from a MySQL database via PHP in a way asynchronous.
In this tutorial, we will be writing a jQuery plugin that will help you draw users’ attention to a specific part of the page, in the form of a small arrow that is displayed next to their mouse cursor. This can be useful for pointing to missed form fields, buttons that need to be pressed, or validation errors that need to be scrolled into view.
This class implements multiline html truncation, expand-collapse links, and wordwrap / hyphenation through JavaScript using the jQuery library. It follows a binary tree split algorithm along DOM textnodes & html nodes. On page load the Truncator will automatically wrap & truncate containers with the truncate class.
Elastislide is a responsive jQuery carousel that will adapt its size and its behavior in order to work on any screen size. Inserting the carousel’s structure into a container with a fluid width will also make the carousel fluid.
In a carousel, one could think that simply making its container “shorter” will solve the problem on smaller screens, but in some cases (e.g. when we have bigger images) it might be reasonable to resize the items as well. This and other options are part of Elastislide’s properties.
Elastislide uses the jQuery Touchwipe Plugin which allows you to obtain the wipe event on an iPhone, iPad or iPod Touch.
This post helps you to submit your form without refreshing page. In this tutorial I will show you how simple it is to do using jQuery form plugin just five lines of JavaScript code, no need to post data string values via ajax. Explained collaboration with validate plugin for implementing form field validations.
FitVids.JS is a lightweight, easy-to-use jQuery plugin for embedding fluid width videos.This jQuery video plugin is easily configurable, simply include jQuery and FitVids.js in your layout and target your videos container with fitVids(). This will wrap each video in a div.fluid-width-video-wrapper and apply the necessary CSS. After the initial Javascript call, it’s all percentage-based CSS magic.
The navigation at apple mac page are using an easing effect, it separating each product by the category, I love the effect when user click on the navigation it like the products appear and disappear one by one, with the easing effect on the end movement, like bouncing on the vertical line
If you see the source code on apple page, seems they are still using prototype.js, once are the most popular javascript framework, before the appearance of jquery. In this post I want to create something like the apple mac navigation menu using jquery easing plugins.
TransformJS is a jQuery plugin which exposes new CSS properties accessible through .css() and .animate() which you can use to apply and manage transformations to a jQuery element.
TransformJS uses feature detection to analyze the supported features of the browser it is running in and adapts accordingly and it maintains an in-memory matrix which it uses to apply the transforms.
The ability to use transforms without constructing huge stylesheets for x-browser compatability is nice.
