Re: adding scripts to header
hello chris,
i’m actually not able to run the first accordion of http://jquery.bassistance.de/accordion/demo/ inside of mytheme/front-page.php
here is my header.php part
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"<?php bb_language_attributes( '1.1' ); ?>>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php bb_title() ?></title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.accordion.js"></script>
<script type="text/javascript" src="js/jqq.js"></script>
<?php bb_feed_head(); ?>
<link rel="stylesheet" href="<?php bb_stylesheet_uri(); ?>" type="text/css" />
<?php if ( 'rtl' == bb_get_option( 'text_direction' ) ) : ?>
<link rel="stylesheet" href="<?php bb_stylesheet_uri( 'rtl' ); ?>" type="text/css" />
<?php endif; ?>
<?php bb_head(); ?>
</head>
<body id="<?php bb_location(); ?>">
........ etc
and the front-page.php part:
<div class="basic" id="list1b">
<a>Titel1</a>
<div>
You've seen it coming!
Buy now and get nothing for free!
</div>
<a>Titel2</a>
<div>
your bear, you have to admit it!
No, we aren't selling bears.
</div>
<a>Titel3</a>
<div>
get two for three beer.
And now, for something completely different.
And now, for something completely different.
</div>
<a>Titel4</a>
<div>
get two for three beer.
And now, for something completely different.
And now, for something completely different.
</div>
</div>
jqq.js is:
jQuery().ready(function(){
// simple accordion
jQuery('#list1a').accordion();
jQuery('#list1b').accordion({
autoheight: false
});
// second simple accordion with special markup
jQuery('#navigation').accordion({
active: false,
header: '.head',
navigation: true,
event: 'mouseover',
fillSpace: true,
animated: 'easeslide'
});
// highly customized accordion
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');
});
// first simple accordion with special markup
jQuery('#list3').accordion({
header: 'div.title',
active: false,
alwaysOpen: false,
animated: false,
autoheight: false
});
var wizard = $("#wizard").accordion({
header: '.title',
event: false
});
var wizardButtons = $([]);
$("div.title", wizard).each(function(index) {
wizardButtons = wizardButtons.add($(this)
.next()
.children(":button")
.filter(".next, .previous")
.click(function() {
wizard.accordion("activate", index + ($(this).is(".next") ? 1 : -1))
}));
});
// bind to change event of select to control first and seconds accordion
// similar to tab's plugin triggerTab(), without an extra method
var accordions = jQuery('#list1a, #list1b, #list2, #list3, #navigation, #wizard');
jQuery('#switch select').change(function() {
accordions.accordion("activate", this.selectedIndex-1 );
});
jQuery('#close').click(function() {
accordions.accordion("activate", -1);
});
jQuery('#switch2').change(function() {
accordions.accordion("activate", this.value);
});
jQuery('#enable').click(function() {
accordions.accordion("enable");
});
jQuery('#disable').click(function() {
accordions.accordion("disable");
});
jQuery('#remove').click(function() {
accordions.accordion("destroy");
wizardButtons.unbind("click");
});
});
info: the js-parts are in the “theme” root (kakumei/js/) , the css parts of the accordion are merged into the original kakumei stylesheet.
thanks so far.