background preloader

jQuery custom content scroller

jQuery custom content scroller
Last updated on Nov 17, 2015 Originally published on August 1, 2010 by malihu, under Plugins. Highly customizable custom scrollbar jQuery plugin. Features include vertical and/or horizontal scrollbar(s), adjustable scrolling momentum, mouse-wheel (via jQuery mousewheel plugin), keyboard and touch support, ready-to-use themes and customization via CSS, RTL direction support, option parameters for full control of scrollbar functionality, methods for triggering actions like scroll-to, update, destroy etc., user-defined callbacks and more. Current version 3.1.3 (Changelog)Upgrading from version 2 When upgrading from version 2.x to 3.x it’s important to use version 3 CSS and .png files. Version 3 is backwards compatible but it’s also a huge overhaul. Version 2 is still maintained and updated here. How to use it Get started by downloading the archive which contains the plugin files (and a large amount of HTML demos and examples). Initialization Initialize via javascript more info Initialize via HTML

Related:  External JS for Edge Animatelasher2013Jquery PluginsStructures esthétiques (HTML, CSS, Jquery...)JS

Edge Commons - Extension Library for Edge Animate and Edge Reflow The clue is in the name: Dirty Little Helpers. There are several modules but also some smaller helper functions available, e.g. to load/nest compositions or to get the name of dynamically created symbols. Center Stage Edge Animate places the stage of the composition in the upper left corner. Google Nexus Website Menu A tutorial on how to re-create the slide out sidebar menu that can be seen on the Google Nexus 7 website. View demo Download source Today I want to show you how to reconstruct the sidebar menu of the Google Nexus 7 page. It slides out with a really nice effect where some subitems get expanded as well. When hovering over a special menu icon, the sidebar icons will be revealed. When clicking on the icon, the whole sidebar menu will be shown.

Textures.js Textures are useful for theselective perception of different categories View on Github Getting started -- from the top of d3.js -- var svg ="#example") .append("svg"); var t = textures.lines() .thicker();; svg.append("circle") .style("fill", t.url());

Customizing Browser Scroll Bar With CSS / jQuery - Hongkiat Windows, OS X and Linux have their own style for the scroll bar as you can see in the following screenshot. This in return could lead to undesired results and consistencies for your design. In this post we will see what we can do to customize the scroll bar look so that it can sit well with your overall design. Recommended Reading: Sticky Position (Bar) with CSS or jQuery Internet Explorer 5.5 Back in IE 5.5, the Internet Explorer team introduced a set of non-standard CSS properties that allows us to style the scroll bar, as follows.

A Simple Parallax Scrolling Technique Parallax scrolling is an interesting technique, where, as you scroll, the background images translate slower than the content in the foreground, creating the illusion of 3D depth. As I planned to re-design my personal website, my first goal was to write the shortest and simplest code to achieve maximum awesomeness! I'll show you how I did it. In this tutorial, I'll teach you the simplest parallax scrolling technique you've ever came across, so let's dig in! This technique revolves around controlling the speed of background image. Building a Drum Simulator for the browser with Animate and Edge Commons Animate as shell to bring together the single parts of the project. Using the Edge Commons to combine the power of Animate with Illustrator and Audition. The Edge Commons extension library is a great way to enhance your capabilities with Edge Animate in various directions. Interactive SVG for instance is a powerful weapon when it comes to creating interaction designs. The Sound Module on the other hand enables you to integrate and control the playback of several sounds in your Animate projects.

50+ CSS jQuery Graph Bar Pie Chart Script & Tutorials - freshDesignweb In tutorials you will see code an Interactive Graph bar chart pie using jQuery and CSS3. We will use the jQuery’s popular graph plugin. plugin is a pure JavaScript library for jQuery. Produces graphical of arbitrary datasets on-the-fly client-side. This plugin is simple but powerful enough to create some nice and interactive graphs.

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.

jQuery UI Demos jQuery UI offers a combination of interaction, effects, widgets, utilities, and themes designed to work well together or on their own. Play with the demos, view the source, build a theme, read the API documentation and start using jQuery UI today. Interactions Interactions add basic mouse-based behaviors to any element.