Starting Carousel at a specifc item

[Solarpitch]

Hi Guys,

 

I have the following simple carousel code that slides a list of items left and right. Image below also shows you how it currently looks with the first active item to the left. Using the code below is there any way I can have the first active item in the center of the carousel.

 

Ideally I want to be able for the carousel to be able to jump to a specific item also.

if I have the following and I've been passed data-id of "104" lets say, I want this to be the center active item in the carousel when I populate it.

 

<ul>
<li data-id="100"></li>
<li data-id="101"></li>
<li data-id="102"></li>
<li data-id="103"></li>
<li data-id="104"></li>
<li data-id="105"></li>
</ul>

 

            var item_width = $('#navigation_ul li').outerWidth() + 10;  
            if(where == 'left'){  
                var left_indent = parseInt($('#navigation_ul').css('left')) + item_width;  
            }else{  
                var left_indent = parseInt($('#navigation_ul').css('left')) - item_width;  
            }  
            $('#navigation_ul:not(:animated)').animate({'left' : left_indent},100,function(){  
                if(where == 'left'){  
                    $('#navigation_ul li:first').before($('#navigation_ul li:last'));  
                }else{  
                    $('#navigation_ul li:last').after($('#navigation_ul li:first'));  
                }  
                $('#navigation_ul').css({'left' : '-300px'});  
            });  

[Mahngiel]

if there's going to be 5 always why not just count -2 ?