$(function() {
    
	$('.selectable').hover(
		function () {
			$(this).css('height', 'auto');
		},
		function () {
			$(this).css('height', '22px');
			$(this).css('overflow', 'hidden');
		}
	);

    //-------- populate form examples
    $('#sort1 li a.selected').live('click', function() {
        //check if the options are visible
        if( $('#sort1 li a.option:visible').length > 1) {
            //hide the options if currently displaying
            $('#sort1 li a.option:not(.selected)').hide();			
        } else {
            //show the options if hidden
            $('#sort1 li a.option:not(.selected)').show();
        }
        return false;
    }); 
		
    //check for selecting a new option
    $('#sort1 li a.option:not(.selected)').live('click', function() {
        //change over the selected class
        $('#sort1 li a').removeClass('selected');
        //apply this to the new selection
        $(this).addClass('selected');
        //update the select option
        $("input[name='option']").val( $(this).attr('title') );
        //slide up the selected option
        $('#sort1 li a.option:not(.selected)').hide();			
        return false;
    });
    
    
    $('#sort2 li a.selected').live('click', function() {
        //check if the options are visible
        if( $('#sort2 li a.option:visible').length > 1) {
            //hide the options if currently displaying
            $('#sort2 li a.option:not(.selected)').hide();			
        } else {
            //show the options if hidden
            $('#sort2 li a.option:not(.selected)').show();			
        }
        return false;
    }); 
		
    //check for selecting a new option
    $('#sort2 li a.option:not(.selected)').live('click', function() {
        //change over the selected class
        $('#sort2 li a').removeClass('selected');
        //apply this to the new selection
        $(this).addClass('selected');
        //update the select option
        $("input[name='option']").val( $(this).attr('title') );
        //slide up the selected option
        $('#sort2 li a.option:not(.selected)').hide();			
        return false;
    });
    
    $('#sort3 li a.selected').live('click', function() {
        //check if the options are visible
        if( $('#sort3 li a.option:visible').length > 1) {
            //hide the options if currently displaying
            $('#sort3 li a.option:not(.selected)').hide();			
        } else {
            //show the options if hidden
            $('#sort3 li a.option:not(.selected)').show();			
        }
        return false;
    }); 
		
    //check for selecting a new option
    $('#sort3 li a.option:not(.selected)').live('click', function() {
        //change over the selected class
        $('#sort3 li a').removeClass('selected');
        //apply this to the new selection
        $(this).addClass('selected');
        //update the select option
        $("input[name='option']").val( $(this).attr('title') );
        //slide up the selected option
        $('#sort3 li a.option:not(.selected)').hide();			
        return false;
    });
                
                
    $('#sort4 li a.selected').live('click', function() {
        //check if the options are visible
        if( $('#sort4 li a.option:visible').length > 1) {
            //hide the options if currently displaying
            $('#sort4 li a.option:not(.selected)').hide();			
        } else {
            //show the options if hidden
            $('#sort4 li a.option:not(.selected)').show();			
        }
        return false;
    }); 
		
    //check for selecting a new option
    $('#sort4 li a.option:not(.selected)').live('click', function() {
        //change over the selected class
        $('#sort4 li a').removeClass('selected');
        //apply this to the new selection
        $(this).addClass('selected');
        //update the select option
        $("input[name='option']").val( $(this).attr('title') );
        //slide up the selected option
        $('#sort4 li a.option:not(.selected)').hide();			
        return false;
    });
		
});