index

jQuery accordion Plugin Demo

Standard, container is a div, header is h3 and content div and nested p

Code

jQuery('#list1a').accordion();
jQuery('#list1b').accordion({
	autoheight: false
});
There is one obvious advantage:

You've seen it coming!
Buy now and get nothing for free!
Well, at least no free beer. Perhaps a bear,
if you can afford it.

Now that you've got...

your bear, you have to admit it!
No, we aren't selling bears.

Rent one bear, ...

get two for three beer.

And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
Period.

There is one obvious advantage:

You've seen it coming!
Buy now and get nothing for free!
Well, at least no free beer. Perhaps a bear,
if you can afford it.

Now that you've got...

your bear, you have to admit it!
No, we aren't selling bears.

Rent one bear, ...

get two for three beer.

And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
And now, for something completely different.
Period.

Navigation - Unordered List with anchors and nested lists.

Location-based state-saving: The active element is choosen based on location.hash: Click one of the links, then reload the page to see it in action.

Code

jQuery('#navigation').accordion({
	active: false,
	header: '.head',
	navigation: true,
	event: 'mouseover',
	fillSpace: true,
	animated: 'easeslide'
});
With options, container is a definition list, header dt, content dd

Code

jQuery('#list2').accordion({
	event: 'mouseover',
	active: '.selected',
	selectedClass: 'active',
	animated: "bounceslide",
	header: "dt"
}).bind("change.ui-accordion", function(event, ui) {
	jQuery('<div>' + ui.oldHeader.text() + ' hidden, ' + ui.newHeader.text() + ' shown</div>').appendTo('#log');
});
Red
Fancy stuff about red thingies.
Green
Green! Green! Green!
Blue
Cool kids are blue.
Divitus structure, div container, div header (class title), div content, no active on startup and can be completely closed

Code

jQuery('#list3').accordion({
	header: 'div.title',
	active: false,
	alwaysOpen: false,
	animated: false,
	autoheight: false
});
Tennis
One ball, two players. Lots of fun.
Soccer
One ball, 22 players. Lots of fun. Go to google?
Baseball

Well, one ball, some guys running around, some guys hitting others with a stick.
Sounds like fun, doesn't it?

Well, apart from the running part. Navigation example

accordion wizard

Code

var wizard = $("#wizard").accordion({
	header: '.title',
	event: false
});

$("div.title", wizard).each(function(index) {
	$(this)
	.next()
	.children(":button")
	.filter(".next, .previous")
	.click(function() {
		wizard.changeAccordion("activate", index + ($(this).is(".next") ? 1 : -1))
	});
});
Header 1
Content 1
Header 2
Content 2
Header 3
Content 3
Activate via selector, eg. ':first' or ':eq(1)':
Log

STARTING FROM

$8

A DAY*

MORE INFO

BGAN

WORLDWIDE INTERNET

MORE INFO

FREE

COURIER DELIVERY*


MORE INFO

SPECIAL


SCHOOL


PRICING

MORE INFO


Home  |  Make a Booking  |  Products  |  Rental  |  Pricing  |  What is a Sat Phone?  |  Links  |  FAQ  |  What You Say  |  Contact Us  |  Blog
Privacy policy |  Terms |  href="/disclaimer">Disclaimer | About Us |
© Copyright 2021 - RentaSATphone.com.au