10 tools for the mobile Web | Colan Infotech Private Limited
10 tools for the mobile Web
Posted by Colan Infotech
Needless to say you that it is not advisable to use all these tools on a single project, for obvious reasons of performance.
320 and up
320 and up is a lightweight framework dedicated to the philosophy "mobile-first" and automatically scheduled breaking points 480, 600, 768, 992 and 1382 pixels. Flexible and scalable, it can be coupled to Modernizr , Bootstrap, LESS and SASS as needed.
jQuip (jQuery in Parts)
Respond.js is a polyfill (alternative) very light and fast allowing older versions of Internet Explorer (IE6-IE8) recognize CSS Media Queries min/max-width.
ReView or "Responsive Viewport" offers the opportunity for the user to move from a "mobile" display to a "desktop" display, and vice versa, by changing the values of the window size ( viewport ) of the browser.
SelecNav.js is a tool to redefine the site navigation: on small screens, the original navigation (HTML list of elements) is transformed into HTML element Select interface, reputed to be ergonomically ideal on the move. SelectNav is a standalone script. There are other tools of this type, such as TinyNav , but they often require jQuery base.
Relocate (and minwidth)
As I mentioned in the introduction, magic CSS positioning as Flexbox are not yet compatible enough for massive use.
Relocate and minwidth are two scripts that overcome this lack:
the first used simply to move items from one container to another depending on the size of the window.
the second allows for conditional loads JS script or other resources, again according to the window size.
Animated scroll to top
This tutorial teaches you how to generate a button to return to the top with motion page. This button is understood that when you scroll the page. Note that you will find a different version of this feature on the site (in French) of CreativeJuiz.
Zurb offers a guided demonstration of a thorny problem to solution in responsive web design how to manage data tables (complex)?
Sequence.js is one of many tools sliders (or slideshows) for responsive images on the Net. However, it has the distinction of being extremely comprehensive and offer three different models of very attractive display.