TILTSHIFT.JS-CSS3 Filter for Shift-axis lens effects

Tiltshift.js is a great jQuery plugin that uses the CSS3 image Filter to achieve the effect of moving the axis of a photo. Using the Data property to configure parameters is very simple. Tips: for the best results, browse through modern browsers such as ie10+, Chrome, Firefox, and Safari .

Effects Demo Plugin Download

HTML Example:

• -position(0-100), defines the position of the focus.
• -blur(0-? ), the blur radius. setting to 1 or 2 is appropriate.
• -focus(0-100), the area of focus size.
• -falloff (0-100), the size of the area between the full focus and the complete blur.
• -direction("x", "Y", or 0-360), direction.

JavaScript Invocation Example:

$ (function () {     $ ('. Tiltshift '). Tiltshift ();});

Related articles that may be of interest to you

• The JQuery effect "attached source" is very useful in website development
• Share 35 amazing CSS3 animation effects Demo
• Stunning 8 x HTML5 & JavaScript Effects
• Web development in a very practical 10 effects "source Download"
• 12 Classic white-rich jQuery images Carousel Plugin

This article link: TILTSHIFT.JS-CSS3 filter for photo shift lens effect

Compilation Source: Dream Sky focus on front-end development technology sharing web design resources

TILTSHIFT.JS-CSS3 Filter for Shift-axis lens effects