$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
});
My problem is that the whole header is clickable, and when you click the header that is when it expands or contracts my "Accordion Boxes". Here is the code for that:
<script type="text/javascript">
//<![CDATA[
var accordionItems = new Array();
function init() {
// Grab the accordion items from the page
var divs = document.getElementsByTagName( 'div' );
for ( var i = 0; i < divs.length; i++ ) {
if ( divs[i].className == 'accordionItem' ) accordionItems.push( divs[i] );
}
// Assign onclick events to the accordion item headings
for ( var i = 0; i < accordionItems.length; i++ ) {
var h2 = getFirstChildWithTagName( accordionItems[i], 'H2' );
h2.onclick = toggleItem;
}
// Hide all accordion item bodies except the first
for ( var i = 1; i < accordionItems.length; i++ ) {
accordionItems[i].className = 'accordionItem hide';
}
}
function toggleItem() {
var itemClass = this.parentNode.className;
// Hide all items
for ( var i = 0; i < accordionItems.length; i++ ) {
accordionItems[i].className = 'accordionItem hide';
}
// Show this item if it was previously hidden
if ( itemClass == 'accordionItem hide' ) {
this.parentNode.className = 'accordionItem';
}
}
function getFirstChildWithTagName( element, tagName ) {
for ( var i = 0; i < element.childNodes.length; i++ ) {
if ( element.childNodes[i].nodeName == tagName ) return element.childNodes[i];
}
}
//]]>
</script>
in the toggleItem() I want to have the same scrolling effect for when someone clicks on the header itself. I tried the following to no avail, and was hoping someone could shove me in the right direction.
function toggleItem() {
var itemClass = this.parentNode.className;
// Hide all items
for ( var i = 0; i < accordionItems.length; i++ ) {
accordionItems[i].className = 'accordionItem hide';
}
// Show this item if it was previously hidden
if ( itemClass == 'accordionItem hide' ) {
this.parentNode.className = 'accordionItem';
$('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
}
}

New Topic/Question
Reply



MultiQuote

|