How to amend jquery slideshow to display pictures correctly?
<p>I added this slideshow jquery gallery in here: <a href="http://bellated.us.lt/" rel="nofollow">http://bellated.us.lt/</a></p>

<p>Actually jquery adds up this line <code>var slideWidth = 500;</code></p>

<p>So at them moment only the last slide is displayed as wanted.</p>

<p>var slideWidth = 500; gives a constraint for a 500px width. For a 500px slideshow it works fine, but what I need is 673px width. Tried to change in query script the width to 673px but it got more messy. Any ideas how to fix this?</p>

<p>The whole jquery script:</p>

<pre><code>&lt;script type="text/javascript"&gt;
$(document).ready(function() {

        var currentPosition = 0;
        var slideWidth = 500;
        var slides = $('.slide');
        var numberOfSlides = slides.length;
        var slideShowInterval;
        var speed = 6000;

        //Assign a timer, so it will run periodically
        slideShowInterval = setInterval(changePosition, speed);

        slides.wrapAll('&lt;div id="slidesHolder"&gt;&lt;/div&gt;')

        slides.css({ 'float' : 'left' });

        //set #slidesHolder width equal to the total width of all the slides
        $('#slidesHolder').css('width', slideWidth * numberOfSlides);



        manageNav(currentPosition);

        //tell the buttons what to do when clicked
        $('.nav').bind('click', function() {

            //determine new position
            currentPosition = ($(this).attr('id')=='rightNav')
            ? currentPosition+1 : currentPosition-1;

            //hide/show controls
            manageNav(currentPosition);
            clearInterval(slideShowInterval);
            slideShowInterval = setInterval(changePosition, speed);
            moveSlide();
        });

        function manageNav(position) {
            //hide left arrow if position is first slide
            if(position==0){ $('#leftNav').hide() }
            else { $('#leftNav').show() }
            //hide right arrow is slide position is last slide
            if(position==numberOfSlides-1){ $('#rightNav').hide() }
            else { $('#rightNav').show() }
        }


        //changePosition: this is called when the slide is moved by the timer and NOT when the next or previous buttons are clicked
        function changePosition() {
            if(currentPosition == numberOfSlides - 1) {
                currentPosition = 0;
                manageNav(currentPosition);
            } else {
                currentPosition++;
                manageNav(currentPosition);
            }
            moveSlide();
        }


        //moveSlide: this function moves the slide 
        function moveSlide() {
                $('#slidesHolder').animate({'marginLeft' : slideWidth*(-currentPosition)});
        }

    });
&lt;/script&gt;
</code></pre>
