[jQuery] Update input box with slider value

[danwednesday]

Hi,

This really should be simple, but I just can't get it to work.  I just
want an HTML input box to show the value of a slider as the handle is
sliding.  It can be done really easily with Scriptaculous (as is seen
in the demo here: 
http://www.aldenta.com/examples/script.aculo.us/slider-text-field.html)
but I'm using jquery in my site anyhow and would rather not use two
large javascript libraries if possible.

Anyhow, the script I have is as follows:

<script type="text/javascript">
        var Slider1Value = 4;
        var Slider1Stepping = 1;
        var Slider1Min = 1;
        var SliderMax = 10;

        $(document).ready(function(){
                $("#example").slider({
                        'stepping': Slider1Stepping,
                        'minValue': Slider1Min,
                        'maxValue': SliderMax,
                        'startValue': [Slider1Value],
                        'slide': function(coordx, coordy, x, y){
                                $('.slider-input').val(coordx);
                        }
                });
        });
</script>
<div id="example" class="ui-slider-1" style="margin:10px;">
        <div class="ui-slider-handle"></div>
</div>
<input type="text" class="slider-input" />



Can anyone see why this isnt' working?

Thanks!