how can i set focus of a rotator / carousel on my web page
<p>How can I set focus of a rotator / carousel on my web page </p>

<p>According to my code both the rotators get slided simultaneously  but I want only  that   rotator to slide which is focussed . </p>

<p>I added the tabindex attribute on the <code>"carousel_inner"</code> <code>div</code> and as well as I also  added   the tabindex on the <code>"#home_rotator"</code> <code>div</code> and then called the focus function but they are focused simultaneously in my webpage</p>

<p>My code is:</p>

<pre><code>$("#carousel_inner").attr("tabindex",0).focus(function() {
    $(document).keydown(function(eventObject) {
        if(eventObject.which==37) {//left arrow
            $("#carousel_inner").focus();               
            $('#left_scroll').click();//emulates click on prev button 
        } else if(eventObject.which==39) {//right arrow
            $("#carousel_inner").focus();               
            $('#right_scroll').click();//emulates click on next button
        }   
    });
});
</code></pre>

<p>// Add keyboard navigation</p>

<pre><code>$("#home_rotator").attr("tabindex",-1).focus(function() { 
    $(document).keydown(function(eventObject) {
        if(eventObject.which==37) {//left arrow
            $("#home_rotator").focus();             
            base.goBack();//emulates click on prev button 
        } else if(eventObject.which==39) {//right arrow
            $("#home_rotator").focus();             
            base.goForward();   //emulates click on next button 
        }           
    });
});
</code></pre>
