PDA

View Full Version : manual scroller with scroll bar



mcpalmer
04-25-2005, 05:06 PM
I'm trying to get the manual scroller script to work alongside a visible scrollbar but the bar does not function properly when moving content up and down. You can see what i mean here:

http://www.mrpdev.co.uk/scrolltest.htm (http://)

Anyone got any ideas?

jscheuer1
04-27-2005, 10:22 PM
I thought this couldn't be done until I was looking into another scrolled content question and it more or less happened. Now with some refinemets, it is a two page solution using an iframe, here is the iframe page:


<html>
<head>
<title>Manual Scroller w/scrollbar - Demo</title>
<script type="text/javascript">
var holder,scrollspeed
</script>
<style type="text/css">
span.cntrl {
cursor:hand;
cursor:pointer;
color:blue;
text-decoration:underline
}
</style>
</head>
<body>
<!--Scrollable iframe script- By Dynamic Drive-->
<!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com-->
<!--Highly modified here-->
<!--This credit MUST stay intact for use-->

<layer visibility=hide>
<div style="width:200px;margin-bottom:3px;text-align:center;cursor:default">
<span class="cntrl" onClick="scrollspeed=1">Down</span> <b>|</b> <span class="cntrl" onClick="scrollspeed=-1">Up</span> <b>|</b> <span class="cntrl" onClick="scrollspeed=0">Stop</span> <b>|</b> <span class="cntrl" onClick="scrollspeed=0;window['datamain'].location.replace('external.htm')">Top</span>
</div>
</layer>
<iframe onMouseOver="holder=scrollspeed;scrollspeed=0" onMouseOut="scrollspeed=holder" id="datamain" width=200 height=150 src="external.htm"></iframe>
</body>
</html>and here is the external.htm file used by it:


<!-- external.htm source-->
<html>
<body>


<div>
<!-- ADD YOUR SCROLLER CONTENT INSIDE HERE -->

<b>What's Hot</b></p>
<p align="left"><strong><font face="Verdana"><small><a href="http://www.dynamicdrive.com/dynamicindex9/encrypter.htm" target="_top">Source
code encrypter</a>&nbsp;</small></font></strong><br>
<font face="Verdana" size="2">Scramble the source of any chunk of code using
this unique script.</font></p>
<p align="left"><strong><font face="Verdana"><small><a href="http://www.dynamicdrive.com/dynamicindex5/flashlink.htm" target="_top">Flashing
links</a>&nbsp;</small></font></strong><br>
<font face="Verdana"><small>Bring attention to special links, by making them
flash!</small></font></p>
<p align="left"><small><strong><font face="Verdana"><a href="http://www.dynamicdrive.com/dynamicindex13/roamcursor.htm" target="_top">Roaming
Cursor</a>&nbsp;</font></strong></small><br>
<small><font face="Verdana">Display a second, &quot;roaming&quot; cursor on your
page with this fun animation script.</font></small></p>
<p align="left"><font face="Verdana"><strong><a href="http://www.dynamicdrive.com/dynamicindex11/animatedtitle.htm" target="_top"><small>Animated
Document title</small></a><br>
</strong><small>Animate into view your document's title!</small></font>

<!-- END SCROLLER CONTENT -->

</div>

<!--DO NOT REMOVE BELOW SCRIPT. IT SHOULD ALWAYS APPEAR AT THE VERY END OF YOUR CONTENT-->

<script type="text/javascript">

//Scrollable content III- By http://www.dynamicdrive.com
//Modified here

var speed

function initialize(){
if (window.parent.scrollspeed!=0){
speed=window.parent.scrollspeed
scrollwindow()
}
}

function scrollwindow(){
window.scrollBy(0,speed)
}

setInterval("initialize()",10)

</script>

</body>
</html>Some behaviors of these two pages will be easy to modify others will take more work, if you need a modification and can't figure it out, let me know.

alexz
07-21-2005, 03:29 PM
How can i make the scroller move up or down on start and without the user clicking
up or down? Also how can add the auto pause?

jscheuer1
07-21-2005, 06:28 PM
Put this on the top (the one with the iframe on it) page:
<body onload="scrollspeed=1">It already pauses onmouseover of the scrolling content. What did you mean by auto pause?

alexz
07-21-2005, 07:08 PM
Put this on the top (the one with the iframe on it) page:
<body onload="scrollspeed=1">It already pauses onmouseover of the scrolling content. What did you mean by auto pause?

I actually don't need the IFRAME page. I just wanted to enable auto scroll
and the pause onMouseover in the manualscroll script.

http://www.dynamicdrive.com/dynamicindex2/manualscroll.htm

Thanks. I will implement the IFrame for something else now that i can make it autoscroll.

alexz
08-10-2005, 04:40 PM
Put this on the top (the one with the iframe on it) page:
<body onload="scrollspeed=1">It already pauses onmouseover of the scrolling content. What did you mean by auto pause?

Is there a way to make it loop as well as control teh scrollspeed?

jscheuer1
08-10-2005, 04:55 PM
Sounds like you want a vertical marquee, am I right? If so, check out this demo (http://home.comcast.net/~jscheuer1/side/marquee.htm). You can make it take up the entire page if that is what you wish.

alexz
08-10-2005, 05:00 PM
Cool.
Thanks

squidly65
08-24-2005, 07:26 PM
Can you make this thing loop?