// if js id object used in function is available, create link to stylesheet that hides and styles toggled content
// minimises 'page bounce' as this can run before content loads
if (document.getElementById) { 
	var $link_element = document.createElement('link'); 
	$link_element.setAttribute("rel","stylesheet"); 
	$link_element.setAttribute("href","../css/hidden.css"); 
	$link_element.setAttribute("media","screen");
var $head_element = document.getElementsByTagName('head')[0];
$head_element.appendChild($link_element);
}

// the toggle function
function toggleList(listID,headID) {
	var state = document.getElementById(listID).style.display;
	 if (state == 'none') {
     	document.getElementById(listID).style.display = 'block';
		document.getElementById(headID).style.backgroundImage = 'url(../images/dlh2-bk-up.gif)';
	 } else {
     	document.getElementById(listID).style.display = 'none';
		document.getElementById(headID).style.backgroundImage = 'url(../images/dlh2-bk.gif)';
	 }
}

$(document).ready(function(){
	//hide the dropdowns and set header backgrounds
	$('#list1, #list2, #list3').hide();
	$('#head1, #head2, #head3').css('background-image','url(../images/dlh2-bk.gif)');
	
	//then do the toggle
	$('#head1, #head2, #head3').click(function(){
		var thisid = $(this).attr('id').split('head');
		thisid = thisid[1];
		if ($('#list'+thisid).is(':hidden')){
			$('#list'+thisid).show('400');
			$('#head'+thisid).css('background-image','url(../images/dlh2-bk-up.gif)');
		} else {
			$('#list'+thisid).hide('400');
			$('#head'+thisid).css('background-image','url(../images/dlh2-bk.gif)');
		}
	});
	
});