Baraja: A Plugin for Spreading Items in a Card-Like Fashion. 15 jQuery Space-Saving Content Sliders and Carousels. Have you noticed that, for instance, when browsing the latest WordPress themes, they almost all include a slider of some sort, whether it is an image gallery or a content slider, or better still, has the capability to incorporate both? Sliders are becoming increasingly popular because they resolve a lot of space problems. Content sliders can offer the viewer a lot of information in a small space, and both content sliders and image galleries can provide user-interaction.
Here we have rounded-up 15 jQuery content sliders and carousels, including a couple of tutorials, for your perusal. jQuery Space-Saving Content Sliders and Carousels TN3 Gallery TN3 Gallery is a jQuery image gallery with slideshow, transitions effects, multiple album options, CSS skinning and much more. It's compatible with all modern desktop and mobile browsers. It's the world's best photo gallery. Anything Slider A fully-featured, customizable content or slide show slider. Conclusion. Jquery.ascensor.js.
jQuery Timelinr ↩ CSSLab. Dando vida al tiempo / Giving life to time Selecciona tu idioma / Select your language: This simple plugin helps you to give more life to the boring timelines. Supports horizontal and vertical layouts, and you can specify parameters for most attributes: speed, transparency, etc. Last stable version: 0.9.6 Configuration: Include the jQuery library and this plugin: Inicialize-it with the default parameters: $(function(){ $().timelinr();}); Or configure it as preferred: HTML markup must be as follows: <div id="timeline"><ul id="dates"><li><a href="#">date1</a></li><li><a href="#">date2</a></li></ul><ul id="issues"><li id="date1"><p>Lorem ipsum.
Icon designed by Sebastián Cortés Changelog: Este sencillo plugin ayuda a que le des más vida y estilo a las aburridas líneas de tiempo. Última versión estable: 0.9.6 Configuración: Incluye la librería jQuery y luego este plugin: Inicialízalo con los parámetros por defecto: O customízalos: El marcado HTML debe ser de la siguiente forma: Cambios: Demo Horizontal. Simple Modal - Another window modal. jQuery pageSlide by Scott Robbin. Advertisement a jQuery plugin which slides a webpage over to reveal an additional interaction pane by Scott Robbin Download PageSlide Now If you've ever used the mobile version of Facebook, or Path,then you've probably seen something akin to PageSlide in action.
Clicking on a button or link slides the page over to reveal a hidden pane,one that usually contains secondary navigation, a form, or additional information. There are several ways to use PageSlide, some of which are shown below.Additionally, there is a responsive demo which shows how PageSlide can be used as a mobile solution. Slide to the right, and load content from a secondary page Slide to the left, and display hidden content from this page in a modal pane Modal This slide uses "modal" option set to "true".
Where can I get it? If you are interested in learning more about PageSlide, it's recommended that you view the project on GitHub. Other jQuery Plugins If you like this plugin, feel free to check out some of the others I've built. Cmpolis/Pagify - GitHub. JqPagination, a jQuery pagination plugin (obviously) Introduction jqPagination is a jQuery plugin that provides a newer method of pagination for your web site or application. Instead of displaying a list of page numbers like traditional pagination methods jqPagination uses an interactive 'Page 1 of 5' input that, when selected, allows the user to enter their desired page number. The plugin will ensure that only valid pages can be selected, a valid request will result in the paged callback.
First, previous, next and last buttons work out of the box, but are optional. Download Fork on GitHub Here are a few key points: Design agnostic Customisable Degrades beautifully Super simple to integrate with your app / site Uses jQuery... who doesn't love jQuery?! Demo It's oversized too, so you can try it when you're drunk! Show / hide event log: Installation Installation is super easy, for a basic setup you'll need the following HTML: And now we'll need to initialise the plugin against our HTML: Customisation Options Callbacks Methods current_page max_page.
Pagify.js Demo. jQuery Lifestream - Create a stream of your online activity. Modern HTML Presentations.