Espero que alguien pueda ayudarme
Saludos
15/06/2007, 02:02
| ||||
| ||||
| imagen como scroll Hola: Tengo una pequeña duda, quería saber si es posible que a través de dos imágenes se consiguiera hacer un scroll, es decir, con dos imágenes de flechas al situar el puntero hiciera las veces de scroll ¿Puede hacerse? ¿Cómo? Espero que alguien pueda ayudarme Saludos |
|
15/06/2007, 02:26
| ||||
| ||||
| Re: imagen como scroll Web ejemplo: http://www.hastechglobal.com/ La cuestion es que debes tener 2 capas que en este caso son: <div id="scroller"> <div id="texto"> bueno leete el css tambien suerte :) |
|
15/06/2007, 02:32
| ||||
| ||||
| Re: imagen como scroll Hola, lo primero muchas gracias por contestarme tan rápido, he estado mirando la página y es algo así lo que yo quiero hacer, sería con ésto? Código HTML: <div id="scroller"> <div id="texto"> <p>HASTECH GLOBAL S.A. , .</p> <p> </p> <p> </p> </div></div> <div id="flechas"><a href="#" onmousedown="P7_VScroller('texto','Up',0,0,'Slow');" onmouseup="P7_VScroller('texto','Stop',0,0,'Slow');" > <img src="images/arriba.gif" alt="desplazar texto hacia arriba" width="16" height="16" class="borde0" /></a> <p> </p> <p> </p> <a href="#" onmousedown="P7_VScroller('texto','Down',0,0,'Slow')" onmouseup="P7_VScroller('texto','Stop',0,0,'Slow');"> <img src="images/abajo.gif" alt="desplazar texto hacia abajo" width="16" height="16" class="borde0" /></a></div> </div> Saludos |
|
15/06/2007, 03:01
| ||||
| ||||
| Re: imagen como scroll bueno lo he puesto todo en uno: Código HTML: <html> <head> <script type="text/javascript"> <!-- function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function P7_VScroller(el,dr,ty,oy,spd) { //v1.7 by PVII var g,gg,fr,sp,pa='',slw=true,m=false,h,ly;ty=parseInt(ty); if((g=MM_findObj(el))!=null){gg=(document.layers)?g:g.style;}else{return;} if(dr=="Stop"){if(g.toMove){clearTimeout(g.p7Magic);}g.toMove=false;} if((parseInt(navigator.appVersion)>4 || navigator.userAgent.indexOf("MSIE")>-1)&& !window.opera){pa="px";} if(navigator.userAgent.indexOf("NT")>-1 || navigator.userAgent.indexOf("Windows 2000")>-1){slw=false;} if(spd=="Slow"){sp=(slw)?2:1;fr=(slw)?40:30;}else if(spd=="Medium"){sp=(slw)?4:1;fr=(slw)?40:10; }else{sp=(slw)?8:4;fr=(slw)?40:10;}if(spd=="Warp"){sp=5000;}var yy=parseInt(gg.top);if(isNaN(yy)){ if(g.currentStyle){yy=parseInt(g.currentStyle.top);}else if(document.defaultView&&document.defaultView.getComputedStyle){ yy=parseInt(document.defaultView.getComputedStyle(g,"").getPropertyValue("top"));}else{yy=0;}} if(document.all || document.getElementById){h=parseInt(g.offsetHeight); if(!h){h=parseInt(g.style.pixelHeight);} }else if(document.layers){h=parseInt(g.clip.height);}ly=ty+parseInt(oy)-h; if(dr=="Down"){if(yy>ly){m=true;yy-=sp;if(yy<ly){yy=ly;}}} if(dr=="Up"){if(yy<ty){m=true;yy+=sp;if(yy>ty){yy=ty;}}} if(dr=="Reset"){gg.top=ty+pa;if(g.toMove){clearTimeout(g.p7Magic);}g.toMove=false;} if(m){gg.top=yy+pa;if(g.toMove){clearTimeout(g.p7Magic);}g.toMove=true; eval("g.p7Magic=setTimeout(\"P7_VScroller('"+el+"','"+dr+"',"+ty+","+oy+",'"+spd+"')\","+fr+")"); }else{g.toMove=false;} } //--> </script> <style type="text/css"> body {padding: 0px; border: 0px; font-family: Geneva, Arial, Helvetica, sans-serif; font-size: 10px; color: #ffffff;} #contenedor_texto {position:relative;width:290px;height:350px;float:left;background-color:#1B1B1F;} #scroller {position:relative;overflow:hidden;width: 260px;height: 245px;left: 0px;top: 75px;z-index: 1;} #texto {height: 270px;width: 232px;padding-left: 25px;float: left;padding-top: 0px;position: absolute;top: 0px;left: 0px;overflow: visible;z-index: 1;} #flechas {width: 20px;position: absolute;float: right;height: 60px;top: 145px;left: 262px;} .borde0 {border-top-width: 0px;border-right-width: 0px;border-bottom-width: 0px;border-left-width: 0px;} </style> </head> <body> <div id="contenedor_texto"> <div id="scroller"> <div id="texto"> <p>HASTECH GLOBAL S.A. , sociedad hispano-lusa de reciente creación, fundada por un grupo de empresas y empresarios con una dilatada trayectoria profesional y que nace como consecuencia de la necesidad de crear las condiciones idóneas para el eventual aterrizaje de la compañía LADARIO Sociedade de Construçoes LDA. en el mercado de la construcción español.</p> <p> </p> <p>En este sentido HASTECH GLOBAL S.A. es un instrumento de gestión y coordinación fundamental, a nivel nacional, cuyo principal objetivo es optimizar las potencialidades que a lo largo de su historia ha sido capaz de crear la compañía LADARIO Sociedade de Construçoes LDA. en su propio mercado natural, el PORTUGUES que es donde procede y en el que actua, tanto en el campo de la obra privada como de la pública estando clasificada en nivel siete de los nueve máximos posibles en ambos tipos de obra. </p> </div> </div> <div id="flechas"> <a href="#" onmousedown="P7_VScroller('texto','Up',0,0,'Slow');" onmouseup="P7_VScroller('texto','Stop',0,0,'Slow');"> <img src="arriba.gif" alt="desplazar texto hacia arriba" class="borde0"> </a> <p> </p> <p> </p> <a href="#" onmousedown="P7_VScroller('texto','Down',0,0,'Slow')" onmouseup="P7_VScroller('texto','Stop',0,0,'Slow');"> <img src="abajo.gif" alt="desplazar texto hacia abajo" class="borde0"> </a> </div> </div> </body> </html> |
