Simple jQuery Slider

by Jerimy Brown

HTML

<body style="margin:0; padding:0">
    <script>
        $(document).ready(function() {
            $backButton = $("#backButn");
            $nextButton = $("#nextButn");
            $strip = $("#strip");
            $backButton.hide();
            $nextButton.css('cursor', 'pointer');
            $backButton.css('cursor', 'pointer');
            $nextButton.click(function() {
                $backButton.show();
                $strip.animate({
                    left: '-521px'
                });
            });
            $backButton.click(function() {
                $backButton.hide();
                $strip.animate({
                    left: '0px'
                });
            });
        });
    </script>
    <div id="sliderContainer" style="position:relative;width:770px">
        <div style="z-index:3;height:46px;width:35px;position:absolute;top:153px;left:0px">
            <img id="backButn" src="http://www.jer1my.com/jsfiddle/0101-NYC-BackArrow.png" width="35" height="46" alt="Back" />
        </div>
        <div id="imagesContainer" style="background:#ffffff;height:355px;width:770px;position:relative;left:0px;top:0px;overflow:hidden">
            <div id="strip" style="background:#ffffff;height:355px;width:1350px;position:relative;left:0px;top:0px">
                <img id="nextButn" src="http://www.jer1my.com/jsfiddle/0101-NYC-MensCard00.jpg" width="521" height="355" alt="Kick Start Your Year - See Our Top Picks" /><a href="http://www.finishline.com/store/product?A=844&categoryId=cat301566&productId=prod741391&icid=mens-new-year+ny14+01-01-14+brooks" target="_blank"><img src="http://www.jer1my.com/jsfiddle/0101-NYC-MensCard01.jpg" width="260" height="355" alt="Shop Adrenaline GTS 14"/></a><a href="http://www.finishline.com/store/shop/_/N-/Ntt-GPS#/store/shop/_/N-33iut/Ne-33id3Z33icsZ3Z33icuZ6Z4Z33icxZ33id0/Ns-P_ManualSortSequence%7C0%7C%7CP_Bestsellers%7C1%7CP_DaysOld%7C0/Ntt-GPS" target="_blank"><img...

CSS

#leftWing, #rightWing {
    display: none;
}
#wall-tile-1, #wall-tile-2, #wall-tile-3 {
    background: #fff !important;
}