Mobile Friendly Website


Doing it with style

CSS MENUSResponsive swipe action menu with momentum

Date : 24th February 2016

For all modern browsers, touch, trackpad and mouse


Using a little javascript for mouse action, this is a horizontal swipe action icon menu suitable for touch screens, trackpads and mouse.

Resize your browser window to see the above icon bar resize and overflow the screen width. A right arrow will appear to indicate that there are more icons off screen.

To see these just swipe on a touch screen, two finger swipe on a trackpad, or click/swipe using a mouse. The icons will scroll with momentum.

Left and right arrows will appear as necessary to indicate that there are icons off screen in that direction.

You can also click/tap the arrows to scroll the icons.

The icons can be clicked/tapped to open the link page, but this will only happen if the icons are not moving.

You may use this method on your personal 'non-profit' web site without seeking my permission.
A link back to CSS PLAY is always appreciated.

Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSS PLAY.

If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced.
Please email me for more information.


Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.


Facebook Twitter rss feed Facebook Fan Page