background preloader


Facebook Twitter

jQuery Timelinr. 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.

jQuery Timelinr

Supports horizontal and vertical layouts, and you can specify parameters for most attributes: speed, transparency, etc. Last stable version: 0.9.54 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: 0.9.54: Bugfix: large timelines now gets centered.0.9.53: Bugfix: arrows hidden when jumping from first and last dates resolved.0.9.52: Problem with arrows nav and 2 or less issues now fixed.0.9.51: As requested, now prev/next buttons are hidden if the issue is in the first/last position. Timeline JS - Beautifully crafted timelines that are easy, and intuitive to use. Timeline - CHAP Links Library. jQuery Plugin/Widget. Timeglider JS is a zooming, panning data-driven timeline widget written in Javascript.

jQuery Plugin/Widget

This widget is the core of our our timeline authoring and publishing app, and can be integrated into any HTML application environment. Timelines can be zoomed by dragging the vertical slider at right: up for zooming in (less time shown) and down for zooming out (more time shown). The mousewheel also works as a zoom controller. Any white area on the "stage" of the timeline can be dragged left and right, as can the blue "ruler" which marks out different units of time. Clicking on an event brings up a small modal window with a description and links if any are provided in the data. A few bullets: Timeglider works well on iPads, but is not yet optimized for Android devices. - Homepage. Timeline Tutorial: Introduction.

Jquery - Creating vertical timelines with Javascript/jQquery. Timeline Portfolio. Martin Angelov Timeline is a jQuery plugin specialized in showing a chronological series of events.

Timeline Portfolio

You can embed all kinds of media including tweets, videos and maps, and associate them with a date. With some design tweaks, this will make it perfect for a portfolio in which you showcase your work and interests. The HTML Timeline comes with a light colored theme by default. First, let’s look at the basic layout of the page: index.html <! In the head section, we have the plugin’s stylesheet – timeline.css, and styles.css, which will hold our customizations. When we call the plugin, it will search for a div on your page with the ID of timeline. As we will be modifying the CSS of the timeline, the fragment above will give you a better idea of the customizations. Timeline Portfolio with jQuery Writing the CSS by looking at the markup alone would be a tough undertaking, given that our rules must have precedence over the ones used in timeline.css.

The jQuery The CSS The previous and next arrows: Done!