Zoomooz.js. Zoomooz is: 6KB gzipped and 18KB minified.
This includes everything but jQuery. Make any web page zoom. Latest version: 1.1.9 (Nov 11, 2013, hacky fix for the back and forward buttons #66) Zoomooz is a jQuery plugin for making web page elements zoom. It can be used for making Prezi like slideshows and for zooming to images or other details. Quirky transformations You can zoom to elements that have been translated, scaled and skewed, and they will morph correctly. Try by clicking on these: Skew Scale Rotate There is some interesting stuff happening in the background to make the morphings work. Adding Zoomooz to your web page Just add this to your web page head and you should be up and running with Zoomooz: The easy way to zoom Simply add "zoomTarget" to the element you want to zoom to when clicked on: <div class="zoomTarget">This element zooms when clicked on. You can also add some additional attributes for tuning the animation as data fields of the element: Here is a demo, click on the elements: Demos.
10 Best jQuery and HTML5 WYSIWYG Plugins. HTML5 WYSIWYG (What You See Is What You Get) is all the rage now! But there is now so many of them around it’s hard to find the best ones. In today’s post we are going to present you what we think 10 of the very best jQuery and HTML5 WYSIWYG plugins just to save your time finding your plugin. Enjoy! Related Posts: 1. It is the most fantastic yet beautiful and easy-to-use WYSIWYG editor on jQuery. Source + Demo 2. wysihtml5 Is an open source rich text editor based on HTML5 technology and the progressive-enhancement approach. Source + Demo 3. Mercury is a full featured HTML5 editor. Source + Demo 4. It is a simple JavaScript WYSIWYG editor that is both lightweight (8KB) and standalone. SourceDemo 5. elRTE Is an open-source WYSIWYG HTML-editor written in JavaScript using jQuery UI. SourceDemo 6. Lets you experience a whole new way of editing. Source + Demo 7. Source + Demo 8. bootstrap-wysihtml5 Source + Demo. Slideshow with jmpress.js.
Today we will create a slideshow using jmpress.js.
The jQuery plugin that is based on impress.js will allow us to use some interesting 3D effects for the slides. View demo Download source You have for sure already seen impress.js, a really great JavaScript library for creating extraordinary 3D presentations. The jQuery port jmpress.js let’s you use this library as a jQuery plugin with some added options. We want to show you today how to use this great plugin to create a responsive slideshow with 3D effects. The icons used in the demo is by Artcore Illustration and they are licensed under theCreative Commons BY-NC-ND 3.0 license. So, let’s start! The Markup We will have a main container which is a section with the class jms-slideshow. Let’s take care of the style. The CSS Since we want to make the slideshow responsive, we will give the main container a percentage width, with some min and max values: The next wrapper is dynamically added, and this will be the visible slideshow wrapper: