Archive for 2012

    Coding a Vimeo API Instant Search App with jQuery

    Coding a Vimeo API Instant Search App with jQuery

    In this tutorial I want to explain how we can build a small Vimeo instant search webapp. I’ll be creating the frontend with jQuery and the backend on PHP. There is actually a full developer’s API with references for programmers. I’ll stick to explaining the more convoluted ideas so that you can follow along with my source code.

    I will first explain how we can put together the HTML document so it runs our frontend Ajax functions. Let’s include a reference to the most recent jQuery library which is used for Ajax calls. I’m also using another file v.js for our custom API commands.

    PreloadJS : Javascript to Manage and Co-ordinate the loading of assets

    PreloadJS : Javascript to Manage and Co-ordinate the loading of assets

    PreloadJS is a library to make working with asset preloading easier. It provides a consistent API for loading different file types, automatic detection of XHR (XMLHttpRequest) availability with a fallback to tag-base loading, composite progress events, and a plugin model to assist with preloading in other libraries such as SoundJS.

    PreloadJS The wrapper that manages all preloading. Instantiate a PreloadJS instance, load a files or manifest, and track progress and complete events.

    jQuery Responsive Carousel Plugin

    jQuery Responsive Carousel Plugin

    Carousel takes simple HTML- and CSS-only carousels and progressively enhances them with features such as page lists, scrolling, class-toggling, timers, timer offsets as well as touch and keyboard events. By following a basic HTML pattern and using some basic CSS, your carousels will also work, to a degree, without JavaScript enabled.

    jQuery Responsive google maps

    jQuery Responsive google maps

    Well, when scrolling a website on your mobile device you can get trapped in a google map due to the Maps scrollbar of death™. This plugin gives you a native google maps on your website and a safe fallback to the static image API of google maps for smaller devices.

    Building Instagram Photo Search Engine With jQuery And PHP

    Building Instagram Photo Search Engine With jQuery And PHP

    In this tutorial I want to explain how we can build a similar instant search web application. Instead of pulling images from Google we can use Instagramwhich has grown tremendously in just a few short years.

    This social network started off as a mobile app for iOS. Users could take photos and share them with their friends, leave comments, and upload to 3rd party networks such as Flickr. The team was recently acquired by Facebook and had published a brand new app for the Android Market. Their userbase has grown tremendously, and now developers can build amazing mini-apps just like this instasearch demo.

    jQuery Responsive Tile Gallery

    jQuery Responsive Tile Gallery

    Responsive Tile Gallery is a completely responsive image gallery. It allows your visitors to easily sort and view all of your images. It also allows you to put your images into categories, load thumbnails instead of full resolution images, and develop a responsive websites for all platforms.

    Features:

    • Fully responsive image gallery
    • Optional categories to let users sort through images
    • Optional lightbox for full resolution viewing
    • Optional Image captions
    • Option to use thumbnail images for faster load times
    • Uses CSS Transitions with jQuery fallbacks for improved performance
    • Cross-browser compatible (from IE7 and up)

    fabric.js : JavaScript Html5 Canvas Library

    fabric.js : JavaScript Html5 Canvas Library

    Fabric.js is a framework that makes it easy to work with HTML5 canvas element. It is an interactive object model on top of canvas element. It is also an SVG-to-canvas parser.

    Using Fabric.js, you can create and populate objects on canvas; objects like simple geometrical shapes — rectangles, circles, ellipses, polygons, or more complex shapes consisting of hundreds or thousands of simple paths. You can then scale, move, and rotate these objects with the mouse; modify their properties — color, transparency, z-index, etc. You can also manipulate these objects altogether — grouping them with a simple mouse selection.

    Html5 and Jquery Slide LightBox

    Html5 and Jquery Slide LightBox

    I would like to show you something called the Html5 and Jquery Slide LightBox. In the internet i see a typical type of lightbox is the one jquery own lightbox so i just make new jquery lightbox that inspire you and your user who visit your portfolio basically we love to showcase our work with awesome place so this is the great jquery plugin where you can showcase your work even you can slide the work with information and even its look creative.

    mailcheck.js : jQuery Kicksend Email domain spelling suggester

    Kicksend : jQuery Email domain spelling suggester mailcheck.js

    The Javascript library and jQuery plugin that suggests a right domain when your users misspell it in an email address.Mailcheck will offer up suggestions for top level domains too, and suggest “.com” when a user types in “user@hotmail.cmo”.

    At Kicksend, we use Mailcheck to help reduce typos in email addresses during sign ups. It has reduced our sign up confirmation email bounces by 50%.

    DOM-Tree : A Christmas tree made out of form elements

    DOM-Tree : A Christmas tree made out of form elements

    I didn’t get a pine tree for Christmas this year so I decided to compensate by creating a digital counterpart out of HTML form elements.