27/09/2004, 17:13
| ||||
| ||||
| Imagenes que hagan de scroll Hola gente!! Sabéis si hay alguna forma de hacer que, dos imagenes (por ejemplo una de una flecha hacia arriba y otra de una flecha hacia abajo) puedan hacer de Scroll? Es decir, si clickas o pasas el ratón por encima de la imagen de la flecha hacia arriba, el Scroll sube. Y al revés con la otra imagen Lo he visto hecho en Flash pero, en HTML o Javascript es posible? Mil Gracias!!
__________________ "No et limites a contemplar aquestes hores que ara venen, baixa al carrer i participa. No podran res davant un poble unit, alegre i combatiu!!" |
|
07/10/2004, 13:12
| |||
| |||
| Hola Renton: Te paso el código tomado de "http://javascriptsource.com" ***inicio*** <HTML> <!-- TWO STEPS TO INSTALL PAGE SCROLLER: 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <HEAD> <style type="text/css"> #item {position:absolute; visibility:hidden; left:0px} </style> <SCRIPT LANGUAGE="JavaScript"> <!-- Original: Brian Gosselin ([email protected]) --> <!-- Web Site: http://www.bgaudiodr.iwarp.com --> <!-- This script and many more are available free online at --> <!-- The JavaScript Source!! http://javascript.internet.com --> <!-- Begin var isNS=(document.layers); var _all=(isNS)? '' : 'all.' ; var _style=(isNS)? '' : '.style' ; var _visible=(isNS)? 'show' : 'visible'; var w_x, w_y, item, okscroll=false, godown; function init(){ item=eval('document.'+_all+'item'+_style); getwindowsize(); item.visibility=_visible; scrollpage(); } function getwindowsize() { w_x=(isNS)? window.innerWidth-5 : document.body.clientWidth; w_y=(isNS)? window.innerHeight : document.body.clientHeight; (isNS)? item.clip.width=42: item.width=42; (isNS)? item.clip.height=20 : item.height=20; moveitem(); } function resizeNS() { setTimeout('document.location.reload()',400); } function moveitem() { if (isNS) { item.moveTo((pageXOffset+w_x-70),(w_y+pageYOffset-50)) }else{ item.pixelLeft=document.body.scrollLeft+w_x-70; item.pixelTop=w_y+document.body.scrollTop-50; } } window.onload=init; (isNS) ? window.onresize=resizeNS : window.onresize=getwindowsize ; function scrollpage() { status = ''; if (okscroll) { if (godown) { (isNS)? window.scrollBy(0,4) : window.scrollBy(0,4) ; } else { (isNS)? window.scrollBy(0,-4) : window.scrollBy(0,-4) ; } } moveitem(); setTimeout('scrollpage()', 40); } // End --> </script> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <BODY> <div id="item"> <a href="javascript:void(0)" onMouseover="okscroll=true; godown=true" onMouseout="okscroll=false"><img src="down.gif" border="0"></a><a href="javascript:void(0)" onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false"><img src="up.gif" border="0"></a> </div> <p><center> <font face="arial, helvetica" size="-2">Free JavaScripts provided<br> by <a href="http://javascriptsource.com">The JavaScript Source</a></font> </center><p> </BODY> </HTML> *** fin *** Solo tenés |
|
07/10/2004, 13:14
| |||
| |||
| Hola Renton: Te paso el código tomado de "http://javascriptsource.com" ***inicio*** <HTML> <!-- TWO STEPS TO INSTALL PAGE SCROLLER: 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <HEAD> <style type="text/css"> #item {position:absolute; visibility:hidden; left:0px} </style> <SCRIPT LANGUAGE="JavaScript"> <!-- Original: Brian Gosselin ([email protected]) --> <!-- Web Site: http://www.bgaudiodr.iwarp.com --> <!-- This script and many more are available free online at --> <!-- The JavaScript Source!! http://javascript.internet.com --> <!-- Begin var isNS=(document.layers); var _all=(isNS)? '' : 'all.' ; var _style=(isNS)? '' : '.style' ; var _visible=(isNS)? 'show' : 'visible'; var w_x, w_y, item, okscroll=false, godown; function init(){ item=eval('document.'+_all+'item'+_style); getwindowsize(); item.visibility=_visible; scrollpage(); } function getwindowsize() { w_x=(isNS)? window.innerWidth-5 : document.body.clientWidth; w_y=(isNS)? window.innerHeight : document.body.clientHeight; (isNS)? item.clip.width=42: item.width=42; (isNS)? item.clip.height=20 : item.height=20; moveitem(); } function resizeNS() { setTimeout('document.location.reload()',400); } function moveitem() { if (isNS) { item.moveTo((pageXOffset+w_x-70),(w_y+pageYOffset-50)) }else{ item.pixelLeft=document.body.scrollLeft+w_x-70; item.pixelTop=w_y+document.body.scrollTop-50; } } window.onload=init; (isNS) ? window.onresize=resizeNS : window.onresize=getwindowsize ; function scrollpage() { status = ''; if (okscroll) { if (godown) { (isNS)? window.scrollBy(0,4) : window.scrollBy(0,4) ; } else { (isNS)? window.scrollBy(0,-4) : window.scrollBy(0,-4) ; } } moveitem(); setTimeout('scrollpage()', 40); } // End --> </script> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <BODY> <div id="item"> <a href="javascript:void(0)" onMouseover="okscroll=true; godown=true" onMouseout="okscroll=false"><img src="down.gif" border="0"></a><a href="javascript:void(0)" onMouseover="okscroll=true; godown=false" onMouseout="okscroll=false"><img src="up.gif" border="0"></a> </div> <p><center> <font face="arial, helvetica" size="-2">Free JavaScripts provided<br> by <a href="http://javascriptsource.com">The JavaScript Source</a></font> </center><p> </BODY> </HTML> *** fin *** Solo tenés que conseguirte un par de .gif con la imágen que desees. |
|
07/10/2004, 15:28
| |||
| |||
| Uff... el que te ha pasado Rosarino es simplemente perfecto.... Aqui tienes una mas tosca y limitada contribucion: <a href="javascript:scrollBy(0,10);">UP</a> Para el otro sentido seria poner -10 en lugar de 10. |
