Lightweight, easy-to-use JavaScript/CSS library to create expandable textarea and write large amount of text easily.
Best jQuery Core Java Script Plugins & Tutorials with Demo
PathJS : Simple, lightweight routing for web browsers
PathJS is a lightweight, client-side routing library that allows you to create “single page” applications using Hashbangs and/or HTML5 pushState.
Features:
- Lightweight
- Supports the HTML5 History API, the ‘onhashchange’ method, and graceful degredation
- Supports root routes, rescue methods, paramaterized routes, optional route components (dynamic routes), and Aspect Oriented Programming
- Well Tested (tests available in the
./testsdirectory) - Compatible with all major browsers (Tested on Firefox 3.6, Firefox 4.0, Firefox 5.0, Chrome 9, Opera 11, IE7, IE8, IE9)
- Independant of all third party libraries, but plays nice with all of them
Blueprint : Tooltip Menu with CSS3 & JavaScript
This is a simple tooltip menu that will show a tooltip submenu when hovering over an item. The submenu will either appear above or below the main menu, depending on where more space is available. Using Modernizr’s touch detection, the menu will either react on hover or on click. Example media queries show how to adjust the style for smaller screens.
Natural Language Form with Custom Input Elements in CSS3 & JS
An experimental form that uses natural language instead of the usual form display. Values are entered using custom input elements.The idea is to turn a classic form into one that uses natural language to obtain information from the user. For that we’ll construct a sentence where some words and parts are select elements and text inputs. We’ll then transform the select elements so that we can customize them.
Natural language forms are quite suitable for some UI cases, not for all, of course. They have a couple of limitations but they can also be more engaging for users if used in the right place and in the right way. Anyway, we wanted to give this concept a try and we’ll show you how we did it.
CSS3 Product Grid Layout with JavaScript
A responsive product grid layout that comes with some UI details for inspiration. The product will rotate showing the backside of the item when the rotate button is clicked. Some examples of how tooltips can appear on hover or click are also included. Media queries can be used to resize the items in the grid or change the number of items in a row. Flexbox is used when supported.
Responsive Retina-Ready Menu with CSS3 & JavaScript
Today we will create a colorful Retina-ready and responsive menu inspired by the colors of the Maliwan manufacturer of the Borderlands game. The menu automatically changes to one of three different layouts depending on the browser window size: a “desktop” inline version, a two columns tablet-optimized version and a mobile version with a menu link to display and hide the navigation for smaller screens. To make the menu fully retina-ready, we will use an icon font so that the icons of the menu won’t get pixelized on resize.
Morphing Devices : Slideshow for showcasing Responsive web design
Today we want to share an experimental “morphing” slideshow with you. The idea is to transition between different devices that show a screenshot of a responsive website or app by applying a “device class”. By using the same elements and pseudo-elements for all the devices, we can create an interesting morph effect. We will control the classes and the switching of the image with some JavaScript. We’ve also added an option for autoplaying the slideshow and for rotating some of the devices.
lunr.js : Simple full-text search in your browser
lunr.js is a simple full text search engine for your client side applications. It is designed to be small, yet full featured, enabling you to provide a great search experience without the need for external, server side, search services.
lunr.js has no external dependencies, although it does require a modern browser with ES5 support. In older browsers you can use an ES5 shim, such as augment.js, to provide any missing JavaScript functionality.
