Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

1.2 blog post

toddparker edited this page Jul 23, 2012 · 6 revisions

Collecting items for the 1.2 blog post

New Widget: Popups

The biggest feature of 1.2 is the new popup widget. The idea with popups is to create a flexible element that makes it easy to place any content or widget in an overlay that floats above the current page. This makes it easy to build a simple tooltip, popup form, map overlay, or lightbox with this same widget.

Popups consist of a container with a data-role of popup and a link with a data-rel of popup that points to the ID of that container. When the link is clicked, the popup is shown. There are options to control whether how it's positioned, add a semi-transparent overlay layer behind the popup, add an animated transition to the popup and more.

Non-inset collapsibles

We've had lots of requests to make collapsible listviews that would reveal a list when a row is tapped. Rather than create a new extension for listviews, we realized we could adapt of existing collapsible widget to do the trick. Now collapsibles have a data-inset option which defaults to true to keep the current collapsible appearance. When this is set to false, the listview goes to the edges of the screen, just like a non-inset listview. To make what looks like a collapsible list that allows multiple sections to be open at once, stack up a series of individual collapsibles with a listviews inside. To force only one section to be expanded at once, use the collapsible set (accordion) to get this behavior. We're really excited to add this capability by just adding a single option to the existing plugin set and hope to enrich the library byt fining similiar opportunities.

Listview Autodividers

Speaking of listivews, we have a cool new feature in 1.2: autodividers. Simple add the data-autodivider attribute to your listview and the framework will automatically add the list dividers based on the contents of your list which is a helpful when generating lists dynamically. Best of all, this is designed to work seamlessly with our listview filter extension so dividers will be added and removed to stay in sync with the current set of filtered items.

Icon-only Buttons in Controlgroups

When icon-only buttons were used in controlgroups, they were simply too small to be finger-friendly so in 1.2, we've improved the design to increase the padding around the icons to make them easier to tap.

Buttons in toolbars: Now mini by default

Prior to 1.2, buttons in toolbars would be full size

Read-only lists: Restyled

We've tweaked the design of read-only lists to make them look less clickable by removing the gradient from the list items and only using the flat color. This provides a clearer visual separation between clickable and read-only lists.

read-only lists restyling, popup, autodividers, padding controlgroup icon-only buttons, fieldcontain forms 60% → 78% (together with label) full width, all buttons default to mini/inline in toolbars

Change Log http://test.jqmobile.de/commit-112-120.html

Clone this wiki locally