...

View Full Version : Emulated scrollbars



sina94
03-21-2004, 05:40 AM
I want to replace the scroll bar on my iframe with buttons. I've seen it done before but I'm not sure if it was with javascript. http://seducius.port5.com

Antoniohawk
03-21-2004, 11:28 PM
http://www.dyn-web.com/dhtml/scroll/

sina94
03-22-2004, 04:54 PM
I've gotten that much on my own, and a lot easier. But what I want is for it to keep scolling as long as they hold down the left mouse button, just like a real scrollbar. But then just use images instead of real scrollbars. Like this:


<script>

whereto = 0;

function scrollup() {
whereto = whereto-25;
mainpage.scroll(0,whereto);
}

function scrolldown() {
whereto = whereto+25;
mainpage.scroll(0,whereto);
}

</script>

<img src="" width="15" height="15" align="right" alt="Scroll up" onmousedown="scrollup();"><br>
<img src="" width="15" height="15" align="right" alt="Scroll down" onmousedown="scrolldown();">

<iframe src="home.html" name="mainpage">
</iframe>


Except, you have to click the button over and over to scroll, same as with the code on dyn-web. I want a nice smooth continuous scroll as long as they hold down the mouse button.

Willy Duitt
03-22-2004, 05:17 PM
Try using setInterval to keep firing your function onmousedown and clearInterval onmouseup.

.....Willy

sina94
03-22-2004, 05:24 PM
Like this?

<img src="" width="15" height="15" align="right" alt="Scroll up" onmousedown="setInterval('scrollup()', 10)" onmouseup="clearInterval()">
<br>
<img src="" width="15" height="15" align="right" alt="Scroll down" onmousedown="setInterval('scrolldown()', 10)" onmouseup="clearInterval()">

Mr J
03-22-2004, 05:43 PM
Please try the following




<HTML>
<HEAD>
<TITLE>Document Title</TITLE>

<script>

whereto = 0;

function scrollup() {
whereto -= 25;
mainpage.scroll(0,whereto);
scrollme=setTimeout("scrollup()",50)
}

function scrolldown() {
whereto += 25;
mainpage.scroll(0,whereto);
scrollme=setTimeout("scrolldown()",50)
}

function stop_me(){
clearTimeout(scrollme)
}
</script>




</HEAD>
<BODY>

<img src="pic01.jpg" width="15" height="15" align="right" alt="Scroll Up" onmousedown="scrollup()" onmouseup="stop_me()"><br>
<img src="pic02.jpg" width="15" height="15" align="right" alt="Scroll Down" onmousedown="scrolldown()" onmouseup="stop_me()">

<iframe src="home.html" name="mainpage" style="height:100px"></iframe>

</BODY>
</HTML>

sina94
03-22-2004, 07:57 PM
Thanks so much...works like a charm...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum