CODEWITHSUNDEEP
jqueryscrolloverflow
Peter
Peter

Reputation: 11825

Jquery - Scroll a DIV(overflow:auto;) with a DIV


how can i scroll a DIV (overflow:auto;) with a DIV?

HTML

<div style="width:100px; height:200px; border:1px solid #ff0000; overflow:hidden;">
   <div id="my_div" style="width:100%; padding-right:20px; height:100%; overflow:auto;" class="sph">
       <div style=" background-color:#c6c6c6; width:10px; height:20px; position: absolute; left:80px; cursor:pointer;" >S</div>
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />
       .. content ...  <br />       .. content ...  <br />       .. content ...  <br />       
   </div>

</div>

<br /><br >
  Use the MouseScroll to scroll or use the [S]croll Div

Example http://jsfiddle.net/sbAfW/11/

Thanks in advance!
Peter

Upvotes: 0

Views: 927

Answers (1)

Nick Spiers
Nick Spiers

Reputation: 2354

Check out the jScrollPane plugin.

The first demo on the demo page is what you might be looking for. You could just remove the background attributes from the jspVerticalBar and jspTrack classes and you're on your way!

Upvotes: 3

Related Questions