Introduction
jqxExpander is a simple and easy to use widget that shows/hides an element. It supports
several built-in expand modes. You can set it up to show or hide an element after
a click, double-click or mouse enter event on the expander’s header. Try jqxExpander in our
jsEditor - cloud solution for JavaScript, HTML and CSS editing, hosting and sharing your web development ideas!
Early History of the Internet
- 1961 First packet-switching papers
- 1966 Merit Network founded
- 1966 ARPANET planning starts
- 1969 ARPANET carries its first packets
- 1970 Mark I network at NPL (UK)
- 1970 Network Information Center (NIC)
- 1971 Merit Network's packet-switched network operational
- 1971 Tymnet packet-switched network
- 1972 Internet Assigned Numbers Authority (IANA) established
- 1973 CYCLADES network demonstrated
- 1974 Telenet packet-switched network
- 1976 X.25 protocol approved
- 1979 Internet Activities Board (IAB)
- 1980 USENET news using UUCP
- 1980 Ethernet standard introduced
- 1981 BITNET established
Features
- Toggle Modes
- Works across devices and browsers
- Web Standards Compliant
- Rich and easy to use JavaScript API
- Easy customization and built-in themes
- Search-Engine Friendly Rendering
Toggle Modes
You can specify the action needed for expanding or collapsing the Expander. jqxExpander
supports the following toggle modes:
- ‘click’ – a navigation item’s content section is expanded
or collapsed when the user clicks the item’s header section.
- ‘double click’ – a navigation item’s content section is
expanded or collapsed when the user double clicks the item’s header section.
- ‘mouse enter/mouse leave’ – a navigation item’s content
section is expanded or collapsed when the mouse cursor is moved over the item’s
header section.
Works across devices and browsers
jqxExpander supports all major desktop and mobile web browsers – Internet Explorer
7.0+, Firefox 2.0+, Safari 3.0+, Opera 9.0+, Google Chrome, IE Mobile, Android,
Opera Mobile, Mobile Safari(IPhone, IPad). jqxExpander automatically detects the
browser’s type and adjusts its internal behavior for optimal rendering and
best user experience. You can easily use this widget even on touch devices.
Web Standards Compliant
Don’t spend time testing on different devices and browsers. Use a reliable, CSS
compliant JavaScript Expander widget based on jQuery, HTML5 and CSS3.
Rich and easy to use JavaScript API
jqxExpander has a rich set of events and built-in functions guaranteeing full control
over the Expander. With the Expander API, you can easily expand or collapse the
content or dynamically change the header or content sections.
Easy customization and built-in themes
jqxExpander ships with 5 professionally designed themes. Each theme is stored in
a separate CSS file which makes it easy to export, customize and re-use. The themes
can be easily switched using a single property.
Search-Engine friendly rendering
jQuery Expander uses a pair of DIV tags for rendering. The first DIV tag represents
the Expander’s Header and the second DIV tag is the Expander’s Content
section. Below is a html markup for building a jQuery Expander.