PDA

View Full Version : Help with scrollable content script



jjvoice
08-03-2006, 12:23 PM
1) Script Title: Scrollable Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex11/scrollc.htm

3) Describe problem: Is there any way to have this script place the scrollbar on the left of the text instead of the right? Thanks for any help!

Bob

mburt
08-03-2006, 01:16 PM
Whoa... I just figured out a way to do this.. :)


<html>
<head>
<script>
function scroll() {
scroller.scrollTop=left.scrollTop
}
</script>
</head>
<body>
<div id="left" style="color:white;position:absolute;left:-70;overflow-y:scroll;overflow-x:hidden;scroll;width:100px;height:100px" onscroll="scroll()">
This is a cool script that allows you to compact any content and confine it within a scrollable mini "window" Save
valuable document space while making your page more "interactive", all at the same time! This script uses two
different techniques- one for IE, one for NS- to create the scrollable window. Scrollbars will be available to
IE 4 users to scroll the window, while NS users will need to use the "up" and "down" buttons instead (since NS
does not support the adding of scrollbars to contents).
</div>
<div id="scroller" style="padding:2px;border:1px solid gray;overflow:hidden;width:100px;height:100px;margin-left:20">
This is a cool script that allows you to compact any content and confine it within a scrollable mini "window" Save
valuable document space while making your page more "interactive", all at the same time! This script uses two
different techniques- one for IE, one for NS- to create the scrollable window. Scrollbars will be available to
IE 4 users to scroll the window, while NS users will need to use the "up" and "down" buttons instead (since NS
does not support the adding of scrollbars to contents).
</div>
</body>
</html>

jjvoice
08-03-2006, 01:34 PM
Mike,

Thanks for the reply! This seems to work fine for the exact code you provided, but I can not figure out how to modify it. For example, if I wanted the window to be 500px wide instead of 100, I tried changing the width:100px to width:500px, but that did not work. Also, it seems like you have to enter your content twice - in both divs? Thanks for any clarification - appreciate the help.

Bob

mburt
08-03-2006, 03:48 PM
I have the content in both divs so the left div will have the same scoll height as the scroller div. When you edit the height, edit both divs, same with width.

mburt
08-03-2006, 03:49 PM
The script isn't actually moving the scrollbar to the left, it's just creating another div, to the left of the actual div.

This may seem a little confusing, so feel free to ask questions :)

jjvoice
08-03-2006, 04:47 PM
Mike,

When I tried to edit the width, I did edit the width in both divs, but it did not work. I tried changing both widths to 500. Here is what it looks like when doing that:

http://www.summitwebpages.com/scroller.jpg