Js. A gridster configuration object.
Define which elements are the widgets. Can be a CSS Selector string or a jQuery collection of HTMLElements. Horizontal and vertical margins respectively for widgets. Base widget dimensions in pixels. The first index is the width, the second is the height. extra_rows: 0 Add more rows to the grid in addition to those that have been calculated. extra_cols: 0 max_cols: null The maximum number of columns to create. Min_cols: 1 The minimum number of columns to create. min_rows: 15 The minimum number of rows to create. max_size_x: false The maximum number of columns that a widget can span. autogenerate_stylesheet: true Don't allow widgets loaded from the DOM to overlap. A function to return serialized data for each each widget, used when calling the serialize method. Draggable.start: function(event, ui){} A callback for when dragging starts. draggable.drag: function(event, ui){} A callback for when the mouse is moved during the dragging. draggable.stop: function(event, ui){}
Chronoline.js. Welcome to the chronoline.js demo page. chronoline.js is a library for making a chronology timeline out of events on a horizontal timescale.
From a list of dates and events, it can generate a graphical representation of schedules, historical events, deadlines, and more. Below are 3 examples with events from the 2012 MLB Regular Season. Monthly Timeline This day-by-day timeline shows off a few features. The events are automatically stacked compactly when they overlap, whether over a single point or a range. Quarterly Timeline Timelines can appear on different scales simply by plugging in one of a few existing defaults or by providing custom functions for it. This timeline also has dragging enabled, so click, hold, and drag to try that out.
Yearly Timeline Even at a very large scope, chronoline.js still functions. And if you didn't notice, the left and right arrows support both single clicks for discrete jumps and click-and-hold to scroll continuously. Support Browser support is: Credits. jQuery Knob demo. KineticJS - HTML5 Canvas JavaScript Library Framework. Jquery.event.drag. A jquery special event plugin that makes the task of adding complex drag interactions, to any element, simple and powerful.
Overview The plugin works by using standard DOM events, and simulating custom events to create a drag interaction. It simplifies a recurring pattern of event interaction that can be fairly complex to design in a consistent, cross-browser manner. The drag interaction, while simple in most basic form, gets quite complex when introduced with issues of distance, handles, text selection, proxy elements, click suppression, and dropping. This plugin is focused on correctly simulating the drag events in a very usable way.
Events A basic drag interaction starts when a user presses down a mouse button with the cursor inside an element (mousedown), continues while the user moves the mouse (mousemove), and ends when the user releases the mouse button (mouseup). Draginit This event is fired when a mouse button is pressed (mousedown) within the bound element. Methods Options Demos.