Dynamic Drive DHTML Scripts- Animated Collapsible DIV
Jun 20, 2007Dynamic Drive DHTML Scripts- Animated Collapsible DIV
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 social networking/ comment sites such as Digg. Three distinguishing features of this script are:
1. The ability for the script to work on both DIVs that have an explicit CSS height attribute defined, and without. In the later case, the script will first hide (versus collapse) the DIV until retrieving its true height on page load.
2. A persistence feature that if enabled will remember if a DIV has been expanded, and upon the user’s return to the page within the same browser session, keep it expanded.
3. The duration of the animation is absolute and user configurable, such as 1.5 seconds. This means regardless of the height of the DIV, the script will take 1.5 seconds to finish revealing it. This creates a uniform period before a DIV is revealed regardless of its height.Have fun sliding content up and down!
Hello! My name is Katie, I'm 25 and from Houston, TX. I am a hardworking and passionate freelance web designer with a degree in eBusiness Web Development who creates clean and professional looking websites of the highest quality. I specialize in standards-based XHTML and CSS web development. The sites I develop are built to be search engine friendly!