jSimplePresentation – Learn how to create a jSimplePresentation using Javascript. This easy application can be used in any system that needed a login verification. Javascript is a web and mobile working system developed to built web and mobile application. It used in several gadgets in the same way as smartphones, tablets, and even television. Javascript is approach source to developers who has an engagement in developing website or mobile apps. It moreover provides an adaptive framework that allows the developer to build apps in a simpler way. In this iOS application source code you will learn nearly animation,design,powerpoint,presentation,slider,slideshow,transition.
Choose from over 1,200 Javascript app templates. Explore items created by our global community of independent developers, confident they’re hand-reviewed by us. Please download (title) source code project through link below.
This item represents a new vision of a slideshow, offered as a jQuery plugin.
Some of possible uses :
- To use it instead of powerpoint in order to present your ideas
- To advertise a product, a website, …
- To make an HTML designed book
- etc, etc.
Features
- Able to use other plugins in addition of this one
- Able to load unlimited number of pages
- It can contains what you want (a page is a simple div)
- The pages (center of the page) are automatically resized with the browser
- Fully and easily customizable
- Very easy to use
- Keyboard navigation (RIGHT / LEFT / SPACE / L)
- Slideshow option
- Autoplay option
- Loop option
- Image preloading option
- Go to a certain page (with secured input control)
- W3C Valid
- Works on iOS (iPhone / iPad) and certainly on Android
- Three themes included (grey, blue, orange)
- 4 transition presets
- You can write your own transition with a simple function in the plugin call
- Transitions can be different for the next and previous actions
- Well commented (most actions in the code contain comments)
How to use it
JS – Syntax
$(document).simplePresentation( autoplay: boolean, loop: boolean, intervalTime: integer, preloading: boolean, transitionFct: function );
JS – Example with a preset transition
var transitionFunction = function(elt, source, transitionTime) Transition.opacity(elt, source, transitionTime); ; $(document).simplePresentation( autoplay: false, loop: false, intervalTime: 2000, preloading: false, transitionFct: transitionFunction );
JS – Example with a transition we write
var transitionFunction = function(elt, source, transitionTime) elt.css("opacity", "0"); // If we're going to the next page if (source == "RIGHT") elt.css("marginLeft", "100%"); elt.animate( "opacity": 1, "marginLeft": "0px" , transitionTime); else elt.css("marginRight", "100%"); elt.animate( "opacity": 1, "marginRight": "0px" , transitionTime); ; $presentation = $(document).simplePresentation( autoplay: false, loop: false, intervalTime: 4000, preloading: true, transitionFct: transitionFunction );
HTML
<div id="container"> <div id="page1"> ... </div> <div id="page2"> ... </div> </div>
Each div with id=”pageX” represent a page.
Each pages must have an id that starts with “page”.
Compatible browsers
This item works with the following browsers :
- Firefox 4+
- IE7+ (uses a separated css stylesheet for IE less than V.9)
- Opera
- Chrome
- Safari
animation,design,powerpoint,presentation,slider,slideshow,transition