views:

92

answers:

1

Hi,

I am trying to make some text scroll vertically using jQuery, I have been following the code example on http://www.switchonthecode.com/tutorials/using-jquery-slider-to-scroll-a-div

Please can someone guide me on how to achieve

  1. Position the slider vertically
  2. Make the text scroll vertically when the slider is moved up or down

EDIT : (comment on @lonesomeday's answer) I've already tried setting orientation:vertical and tried changing

  1. scrollWidth to scrollHeight
  2. width to height
  3. scrollLeft to scrollTop

in the functions handleSliderChange and handleSliderSlide but that doesn't work

Many thanks

A: 

Using the jQuery UI slider, you can do this easily with the orientation switch:

$('#slider').slider({orientation: 'vertical'});

In the example you're using, you should invoke it as follows:

$(document).ready(function(){
  $("#content-slider").slider({
    animate: true,
    change: handleSliderChange,
    slide: handleSliderSlide,
    orientation: vertical
  });
});

Note that you'll probably have to make some styling changes to make it look as pretty as the original example.

lonesomeday
@lonesomeday, thank you for your time. I've already tried what you suggested, please see my edited question.
Anand
There are vertical slider tutorials on the internet (e.g. [this one](http://www.simonbattersby.com/demos/vertical_scrollbar_demo.htm)). I'd suggest you try using one of them.
lonesomeday
fantastic :) Many thanks
Anand