긍정적 사고, 음식의 절제, 규칙적인 운동

.delegate()

http://api.jquery.com/delegate/

Using body as the delegate

For best performance, attach delegated events at a document location as close as possible to the target elements. Avoid excessive use of document or document.body for delegated events on large documents.

HTML handle the Drag and Drop events:

Using document as the delegate

The document element is available in the head of the document before loading any other HTML, so it is safe to attach events there without waiting for the document to be ready.
By default, most events bubble up from the original event target to the document element.

It’s all about Speed!?

테스트 URL : http://jsperf.com/jquery-body-delegate-vs-document-delegate

http://www.flotcharts.org/

Homepage: http://www.flotcharts.org/
GitHub: https://github.com/flot/flot
Docs: https://github.com/flot/flot/blob/master/API.md
Twitter: http://twitter.com/flotcharts
Demo Page: http://www.flotcharts.org/flot/examples/

Top 10 Cool JavaScript Framework for Mobile touch screen platforms

http://www.inspirefirst.com/2013/04/18/top-10-cool-javascript-framework-mobile-touch-screen-platforms/

The demand for mobile app development has shot up in recent years. This is owing to the emergence of myriads of smart phones and tablets that people are using for web access. A lot of such devices are touch screen based and that explains why mobile app developers are resorting to applications and frameworks that enable touch based mobile app creation simpler. However, this is not exactly a cakewalk and given the fact developers need to stay updated with prevalent trends and user needs, it can take a toll on creativity.

Mobile app and website development is done using JavaScript most of the times. This is because of the fact it is compatible with major OS and platforms and does not require complex coding. For a mobile developer it is important to know widely used and effective JavaScript frameworks that can be used to develop versatile apps and cutting edge responsive mobile websites.

Hammer.js
Hammer.js is a widely used light framework which offers support for popular touch screen gestures like pinch. Drag, swipe, double tap and rotate. It can be used in mobile OS environments including BlackBerry, Android, Windows Mobile and iOS.

FastClick
FastClick is a useful library that eliminates the usual 300ms delay existing between a finger tap and initiation of a click event in all mobile browsers. As a result, users get an experience of speedier web browsing on their devices. It offers support for mobile web browsers like Mobile Safari, Chrome, Android Browser and Opera Mobile.

jQueryUI
jQueryUI is ideal for those developers who deal with apps built on jQuery JS Library for themes, widget, interaction and visual effect creation. With this framework you can make interactive online mobile apps within short time span.

Swipe
Swipe is a very useful touch slider, which supports swiping and offers fast response. It has hardly any alternative.

JQUERY.PEP.JS
JQUERY.PEP.JS is a plug-in with small footprint that enables kinetic-dragging in desktop and mobiles. It makes use of animate functions of jQuery and CSS animations to allow users add kinetic drag functionality in HTML5 enabled devices. It also has support for stopping, starting and dragging events.

FooTable
FooTable is a capable jQuery plug-in that is used to make HTML tables on handled devices like tablets and touch screen based smart phones. It allows developers to make the tables appear neat no matter how much data is put in the columns. With this framework, you can convert HTML tables in responsive and expandable tables.

Quo JS i
Quo JS is a JaveScript library that enables developers to pass through HTML documents, deal with Ajax interactions and handle events for efficient mobile web development. With this library, you can generate cross-browser code easily.

TinyNav.js
TinyNav.js is a small sized jQuery plug-in that enables changing <ol> and <ul> navigations to select dropdowns in small screen devices.

Pointer.js
Pointer.js is ideal if you want to unify mouse and touch based events. This is essential because lots of mainstream computers are going to be driven by touch inputs in near future.

Jo
Jo enables developers to create web apps as well as native mobile apps with same coding. This can prove to be a real timesaver. It runs on Chrome OS, BlackBerry, Android and iOS. It is Open Source and requires no usage or licensing cost. This framework has UI elements like web form widget and popup widget. The former can be used to make log in screens and the latter is useful for offering users extra information when they click any interface element.

These are the major touch screen specific JavaScript frameworks developers can benefit from. However, there are other popular apps like Sencha Touch that you can try.

8 jQuery Form Label (HTML5 Placeholder) Plugins

http://www.jquery4u.com/plugins/8-jquery-form-label-html5-placeholder-plugins/

HTML5 Placeholder Example

Let’s take a look at the plugins!

1. Sticky Placeholders jQuery Plugin

Tested works IE7+

SourceDemo

2. jQuery Form Labels Plugin

The jQuery FormLabels Plugin is a result of working with hundreds of different clients, sites, and especially forms. Every form is different, so building a uniform label generator was not an easy task.

SourceDemo

3. jQuery Placeholder Plugin

This is a simple plugin for jQuery that provides support for the HTML5 placeholder attribute in browsers that do not already support it.

Source + Demo

4. jLabel

A jQuery plugin that formats text input fields with unobtrusive labels featuring interactive suggestions.

Source + Demo

5. Sign in Form Placeholders

Tested works IE7+

Source + Demo

6. In-Field Labels jQuery Plugin

A simple plugin that turns properly formatted HTML forms into forms with in-field label support. Labels fade when the field is focussed and disappear when text entry begins.

Source

7. movinglabels

A jQuery Plugin, presented by Ape Unit GmbH, coded by Paul Lunow.

Source + Demo

8. Advanced jQuery Placeholder Plugin (cross-browser support)

Plugin that enables you to use the Placeholder attribute inside your input fields.

Source

jquery를 이용한 이미지 360 회전 플러그인

http://creativecan.com/2013/04/jquery-360-image-rotation-plugins/

With a jQuery 360 image rotation plugin, you can make stunning product presentations that make visitors say wow.

Having a website that stands out is crucial for many businesses especially if their primary goal is to create a selling or present a product. Some of the more popular techniques are using jquery slider and carousel plugins to feature your images online as this adds a dynamic flow to an otherwise static page.

However, one of the newer techniques that really helps you bring your products to live is jQuery 360 image rotation plugins. This type of plugin gives you the ability to rotate the images 360 degrees making it possible for customers to study all the details of the products. In addition, you can use jQuery zoom plugins to allow visitors to investigate details in high-resolution images. I found this collection at Tripwire Magazine you may find useful.

I have rounded up more than 15 of the coolest jQuery 360 image rotation plugins for you to easily browse through and find the right one for your website. Please leave a comment letting me know if you use 360 image rotation or if you would consider it. Help us spread this article on Facebook and Twitter if you know of anyone who would benefit from using 360 image rotation on their website. Enjoy!

360° Panoramic Viewer – MORE INFO / DEMO

A panorama is a wide-angle view made from a series of images combined together using special software. It offers a very realistic experience, giving the sensation that the user is right there on the location. The plugin manipulates such a panorama and uses jQuery to rotate, add hotspots and integrate it on mobile, touchpads and desktop browsers.

360 panorama for jQuery – MORE INFO / DEMO

A jQuery plugin for displaying your images in a 360 degree panoramic view. Allows several options on how to control the animation, rotation speed and parameter direction.

Expo360° – 360° Product Viewer – MORE INFO / DEMO

Opposite to existing 360° viewers available online, this viewer doesn’t use Flash and offers great interaction on mobile devices such as iPad and iPhone. What makes it even more unique is the extensive set of configurations possible. It allows you to create a look and feel that will match your online presence perfectly.

SpriteSpin- MORE INFO / DEMO

Spritespin is a jQuery plugin that is able to play sprite image animations. It takes an array of images or a stiched sprite sheet and plays them frame by frame like a flip book. The aim of this plugin is to provide a 360 degree view of some kind of product. There is no flash needed. Everything is done with javascript and the jQuery framework.

360 jQuery Image Slider – MORE INFO / DEMO

AJAX-ZOOM – 360/3D Spin & Zoom JavaScript Player  – MORE INFO

AJAX-ZOOM is a unique tool to present 360° product images on the web. Users can rotate the VR 360 object, also on Z-axis (3D multirow). Additionally deep zoom on every frame (the sprite contains a set of single images of the same object). The adoption of image tiles technology (image pyramid) allows the usage of high resolution images without compression. It has full support for touch devices and works great on iPad (without Flash plugin). Pinch zoom (with two fingers) is implemented too.

360 Image Slider – MORE INFO

Using JS, CSS and a pre-rendered image sequence a 360 view image slider was created which enables the user to drag and spin the 3D object around its y-axis using simple mouse or touch events.

Dopeless Rotate jQuery Plugin 360 Degrees Product Viewer – MORE INFO / DEMO

Dopeless Rotate is Jquery plugin for 360 degree product visualisation.

Reel – MORE INFO / DEMO

Reel 1.2.1 is an established jQuery plugin which takes an ordinary image tag and transforms it into a gorgeous interactive 360° object movie, panorama or stop-motion animation.

WordPress 360° Image Slider – MORE INFO / DEMO

The WP 360º Image Slider is a highly configurable plugin that adds slider functionality to your posts or pages.

View3D Javascript – MORE INFO / DEMO

Viewer3D is a small jQuery plugin for displaying a 360° view of a sequences of images or panorama. It is simple, lightweight, no flash needed, no extra css need, fast and compatible with all major browsers and touches devices. It has been tested on Android browsers, Ipad browser, IE 6,7,8,9 , Firefox, Chrome, Safari and Opera.

Mini 360 Viewer – MORE INFO / DEMO

This JavaScript jQuery plugin can use any number of sliders. it includes a control bar, main drag and rotate area and a rotation toggle button.

jQuery Image Cube – MORE INFO / DEMO

A jQuery plugin that sets a division to rotate between images (or other things) as if they were on the faces of a cube.

360 Degrees Viewer – WordPress Plugin – MORE INFO / DEMO

This viewer uses a list of images to simulate a 360 degrees object rotation or object animation.
The multiple interaction methods makes is usable even on touch devices.

j360 – MORE INFO

j360 is a jQuery plugin designed to display 360 view of product using a set of images. Compatible with iPhone, iPod, iPad, Google Android devices.

Picture 360 Rotation – MORE INFO / DEMO

Toolbar.js – jQuery plugin for responsive tooltip-style toobars

Toolbar.js is a jQuery plugin that will allow you to quickly create responsive (follows the element on resize) tooltip-style toolbars for use in web appss and sites. The toolbar is easily customisable using Twitter Bootstrap icons and provides flexability around the toolbars display and number of icons.