Textures.js
Textures are useful for theselective perception of different categories View on Github Getting started -- from the top of d3.js -- var svg = d3.select("#example") .append("svg"); var t = textures.lines() .thicker(); svg.call(t); svg.append("circle") .style("fill", t.url()); Lines textures.lines(); textures.lines() .heavier(); textures.lines() .lighter(); textures.lines() .thicker(); textures.lines() .thinner(); textures.lines() .heavier(10) .thinner(1.5); textures.lines() .size(4) .strokeWidth(1); textures.lines() .size(8) .strokeWidth(2); textures.lines() .orientation("vertical") .strokeWidth(1) .shapeRendering("crispEdges"); textures.lines() .orientation("3/8") .stroke("darkorange"); textures.lines() .orientation("3/8", "7/8") .stroke("darkorange"); textures.lines() .orientation("vertical", "horizontal") .size(4) .strokeWidth(1) .shapeRendering("crispEdges") .stroke("darkorange"); textures.lines() .orientation("diagonal") .size(40) .strokeWidth(26) .stroke("darkorange") .background("firebrick"); Paths
jquery slimScroll
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rhoncus, felis interdum condimentum consectetur, nisl libero elementum eros, vehicula congue lacus eros non diam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque rhoncus aliquet porta. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla rhoncus elementum convallis. Nullam scelerisque facilisis pretium.
type.js
nicescroll
Nicescroll is a jquery plugin, for nice scrollbars with a very similar ios/mobile style. NOW support HORIZONTAL scrollbar too! Easy-to-use solution to have a custom scrollbars compatble with destkop, tablet and phone devices. It supports DIVs, IFrames, textarea, and document page (body) scrollbars. Compatible with all desktop browser: Firefox 4+, Chrome 5+, Safari 4+ (win/mac), Opera 10+, IE 6+. (all A-grade browsers) Compatible with mobile device: iPad/iPhone/iPod, Android 2.2+, Blackberry phones and Playbook (WebWorks/Table OS), Windows Phone 7.5 Mango and Windows Phone 8. On modern browsers hardware accelerated scrolling has implemented. simple installation and activation, it works with NO modification of your code. Recall ALWAYS in (document) ready statement. It's a plugin for the jquery framework, you need to include jquery in your scripts. Put loading script tag after jquery script tag and loading the zoom image in the same folder of the script: 1. 2. 3. 4. 5. 6. 7.
Infinity.js
A ListView is a container that moves content in and out of the DOM on the scroll event. ListViews help keep repaint times of expensive pages down (and scrolling smooth) by making sure that there are never too many elements onscreen at a single time. ListViews excel at speeding up long lists of complex HTML elements, where new content is frequently appended to the end and existing content is rarely removed. ListViews are simple, and have several caveats: they can't be nested inside each other, and they can't have heights set via CSS. Note Because Firefox implements the unspecified behavior of <img> tags without src attributes differently than other browsers, if you're lazy-loading images inside of a ListView you should set their display to either block or inline-block, or Firefox will report the wrong height data to Infinity.
nanoScroller.js
nanoScroller.js is a jQuery plugin that offers a simplistic way of implementing Mac OS X Lion-styled scrollbars for your website. It uses minimal HTML markup being .nano > .nano-content. The other scrollbar div elements .pane > .nano-slider are added during run time to prevent clutter in templating. The latest version utilizes native scrolling and works with the iPad, iPhone, and some Android Tablets. Downloads To start using, you need three basic things: 1. The following type of markup structure is needed to make the plugin work: <div id="about" class="nano"><div class="nano-content"> ... content here ... Copy the HTML markup. Link to the nanoscroller.css file inside your page's <head> section (...or copy the contents from it to your page's main stylesheet file). You should specify a width and a height to your container, and apply some custom styling for your scrollbar. 3. Running this script will apply the nanoScroller plugin to all DOM elements with a .nano className. Advanced methods
Boba.js / space150
jScrollPane - cross browser styleable scrollbars with jQuery and CSS
davist11/jQuery-One-Page-Nav