Question

I am using jquery ui accordion to view different data to user, it’s working perfectly as described in jquery ui/demos, however what I want to achieve is to change the effect of the sliding effect such that instead of sliding up and down, i want to make it slide left and right (like image catalouges, visual design in this page http://wiki.jqueryui.com/w/page/12137702/Accordion?SearchFor=accordion+horizontal&sp=1) so is it possible to do that?
javascript:

$(function() {
                $("#accordion").accordion({autoHeight:false, collapsible: true, navigation: true,
                    clearStyle: true,
                    change: function(event, ui) {
                        resize_iframe();
                    }
                });
            });

code:

echo '<div id="accordion">';
        while ($r = mysql_fetch_assoc($get_role)) {
            $role = $r['role'];
            if ($role == 'author') {
                echo '<h3><a href="#">Author</a></h3>';
                echo "<div>";
                AuthorView($member_id, $conference_id, $start, $end, $today);
                echo "</div>";
            } else if ($role == 'organizer') {
                echo '<h3><a href="#">Organizer</a></h3>';
                echo "<div>";
                OrganizerView($conference_id, $end);
                echo "</div>";
            } else if ($role == 'reviewer') {
                echo '<h3><a href="#">Reviewer</a></h3>';
                echo "<div>";
                ReviewerView($member_id, $conference_id, $start, $end, $today);
                echo "</div>";
            }
        }
        echo "</div>";

Answer 1

Two working demos, whichever suits you for the cause: http://jsfiddle.net/g4NLf/

Edit: new demo: http://jsfiddle.net/g4NLf/ or http://jsfiddle.net/g4NLf/show

One uses a simple accordion, and another use a small lib for.

http://nicolahibbert.com/demo/liteAccordion/

HTML is in the demo link.

Code

$('.accordion').accordion({collapsible:true,active:false});

or

$(function(){
    $('#one').liteAccordion({
                        containerWidth:400,
                        autoPlay : true,
                        pauseOnHover : true,
                        theme : 'dark',
                        rounded : true,
                        enumerateSlides : true                    
                })
    
})

Scripts:

<script src="http://nicolahibbert.com/demo/liteAccordion/js/liteaccordion.jquery.js"></script>

<link href="http://nicolahibbert.com/demo/liteAccordion/css/liteaccordion.css" rel="stylesheet" />