there are lots of plugins to do this

look for carousel or scroll in a plugin search

jCarousel and scrollable are 2 excellent ones that come to mind as well as scrollto

W. Young wrote:
A good example of the behavior I want is on the firefox addons home
page https://addons.mozilla.org/en-US/firefox/?application=firefox

At the top, there is a pane for viewing the content of three items at
a time with a back and forward button to scroll through.
I need a similar way to slide one item at a time.

On Aug 26, 10:16 am, "W. Young" <wayland.yo...@docupak.com> wrote:
  
I have a container div with two inner divs.  I have one inner div
visible taking up 100% of the visible area and another hidden div.  I
want the visible div to slide to the left while simultaneously sliding
the other div in from the right.  This works fine except that while
the right div is sliding in, it appears below the left div.

How can this be done?

Here is the code:

<script type="text/_javascript_" src=""></script>
<script type="text/_javascript_" src=""></
script>
<script type="text/_javascript_" src=""></
script>

<script type="text/_javascript_">
        $(document).ready(function() {
                $("#slide").click(function() {
                        $("#leftDiv").hide('slide', { direction: 'left' }, 1000);
                        $("#rightDiv").show('slide', { direction: 'right' }, 1000);
                        return false;
                });
        });
</script>

<div id="container" style="height: 100px; ">
        <div id="leftDiv" style="float: left; border: solid 1px black;
height: 100px; width: 100%;">
                <span>some text to slide out left</span>
        </div>
        <div id="rightDiv" style="float: left; display: none; border: solid
1px black; height: 100px; width: 100%;">
                <span>some text to slide in right</span>
        </div>
</div>
<div style="clear: both; height: 100px;">
        <input id="slide" type="button" value="Slide" />
</div>
    

  

Reply via email to