Animated Collapsible DIV v2.4. July 3rd 09': Updated to v2.4, which supports a new set of "rel" and data-image" attributes you can insert into arbitrary links to quickly create link or image link togglers.
Description: This script collapses any DIV on the page and lets users manually toggle its appearance via a smooth "Web 2.0 style" animation. It's a popular effect on many social networking/ comment sites. Three distinguishing features of this script are: Ability for the script to work on both DIVs that have an explicit CSS height attribute defined, and without. Ability to "group" multiple collapsible content instances to act as a single unit, so opening one closes the others. Have fun sliding content up and down! Dynamic Calendar II. Paste jQuery Mega Menu. Home / Free JavaScripts / Menu and redirection / Here Description: Mega Menus refer to drop down menus that contain multiple columns of links.
This jQuery script lets you add a mega menu to any anchor link on your page, with each menu revealed using a sleek expanding animation. Customize the animation duration plus delay before menu disappears when the mouse rolls out of the anchor. Mega cool! Example: Directions Step 1: Add the following code to the <head> section of your page: It references two external files. Step 2: Add the below HTML code to your page. Configuration info Each Mega Menu consists of an HTML anchor link, plus its associated drop down menu. Paste Dbmenu (CSS drop down menu) Paste CSS Horizontal List Menu.
Home / Free JavaScripts / Menu and redirection / Here Description: This is a lean CSS horizontal menu.
The markup is entirely based on an ordinary HTML list, with support for 1 level of nested lists. The nested lists are transformed into 2nd level drop down menus that appears dynamically onmouseover. The entire menu interface is styled via the external CSS, even the arrow image that you can customize to appear automatically beside menu items that carry a 2nd level. Enjoy! Featured Content Slider v2.4. Jan 23rd, 13: Updated to v2.5, which modifies onChange event handler behaviour for more robustness , plus added section on embedding YouTube videos inside the Slider.
July 18th, 15': v2.51: Set revealtype to always "click" in mobile browsers (instead of "mouseover") Description: Featured Content Slider makes a slideshow out of arbitrary content on your page, so users can manually select a content to see or have them rotated automatically. Each content is defined simply inline on the page as regular HTML, or altogether inside a single external file and fetched via Ajax instead. Where this script shines is the versatile pagination links interface, which can be customized in a variety of ways. You may have such a script on the frontpage of sites such as Rottentomatoes and Gamespot, though the difference is that Featured Content Slider is Flash free! And with the introduction out of the way, here's a listing of Featured Content Slider v2.0's features: Nifty! Glossy Accordion Menu.
Glossy Accordion Menu In this example, the menu headers are A tags, with each sub menu being DIV tags that expand/ contract.
The use of DIV tags for the sub menus is to facilitate content other than UL lists. An absolutely positioned icon image gets dynamically added to each header that changes depending on the header state. The headers are toggled via "click" of the mouse, and all headers can be collapsed. The previous expanded header (if any) is closed before expanding the current. Expand 1st header within menu above through a URL parameter Required external file (right click, and select "Save As"): ddaccordion.js Entire HTML Source code: The menu uses four images for the purpose of styling the menu (download by right clicking, and select "Save As"): Accordion Content script (v2.0) Feb 16th, 12' (v2.0): Added option ("scrolltoheader") to scroll to the expanded header in question after it expands (useful if a header contains long content).
Description: Group contents together and reveal them on demand when the user clicks on their associated headers, with Accordion content script! Specify whether only one content within the group should be open at any given time, style the headers depending on their content state, and even enable persistence so the state of the contents is preserved within a browser session. The script enlists the help of the jQuery library for its engine. There are lots of configurable options, so lets get to them: Headers and their contents to expand/collapse on the page are identified through the use of shared CSS class names for easy set up. You don't have to be an accordion player to appreciate this script! Dynamic Drive DHTML scripts- Switch Content Script II (icon based) Dynamic Drive DHTML scripts- Switch Content Script. Notes: Jan 25th, 07: to fix a bug with the defaultExpanded() feature not being honoured when persistence is enabled.
Only applicable the first time the page is loaded within a browser session. Only .js file changed! April 5th, 07: Added ability to persist content states by x days versus just session only. Only .js file changed! Description: One of the most versatile scripts of its kind, we created this one to compact arbitrary content on your page so they're expandable on demand. Works unobtrusively in all modern browsers. Most of the features listed are optional and can be enabled/ disabled as desired.