This category contains all the jqDock examples that I have put together. You may find them easier to view on the Examples page, below jqDock.
Very basic example of how it’s possible to manipulate menu items by destroying the Dock (requires v2.0+), changing it, and then re-initialising it. I’ve used a list, but the same principles apply for non-lists. Note that care needs to be taken with styling in order to get seamless transition between docked and undocked!
I was asked if it was possible to sit the menu on a 3D-type base, similar to another ‘Dock’ plugin for jQuery. The answer is … Yes.
This is another list example, primarily to demonstrate that destroying a list returns it to its initial state. The list is not hidden, and you get to create it, and destroy it, at will. (This is functionality introduced in v2.0)
This takes an unordered list (UL) that has ‘data-’ attributes and a jqDockAuto class, and automatically runs jqdock on it. A new menu is constructed from the list – one that jqdock can work with – and is displayed. (This is new functionality introduced in v2.0)
Uses ‘data-’ attributes and the jqDockAuto class to get jqdock to automatically initialise the menu. No extra javascript required! (This is new functionality introduced in v2.0)
The only difference between this and an earlier example (Multiple horizontal menus, with selectable loader) is that there is virtually no gap between rows here, and an expanding image overlaps the neighbouring rows.
Wide horizontal menu, using background images, and a slider to move the menu left/right. onReady is set by overriding the defaults, rather than from options.
HTML5 version of preceding example, utilising ‘data-’ attributes to set options, and calling $( ).jqdock() instead of $( ).jqDock().
Horizontal & vertical menus of links, with a ‘top’ level activating 1 or more of 3 ‘sub-levels’. Out-of-sight menus are positioned outside the viewport.
Horizontal menu of links with ‘top’ alignment. Similar to the preceding ‘jigsaw’ example, but with labels enabled at mid-centre.