Foros del Web » Creando para Internet » HTML »

Ayuda Con Scrollbar!!!!

Estas en el tema de Ayuda Con Scrollbar!!!! en el foro de HTML en Foros del Web. Hola muchachos, estoy haciendo una web muy sencilla y pequeña, tanto en número de páginas interuiores como en tamaño (650 x 400 px). Lo que ...
  #1 (permalink)  
Antiguo 06/03/2003, 13:14
Avatar de Clicker  
Fecha de Ingreso: febrero-2003
Mensajes: 51
Antigüedad: 21 años, 1 mes
Puntos: 0
Pregunta Ayuda Con Scrollbar!!!!

Hola muchachos, estoy haciendo una web muy sencilla y pequeña, tanto en número de páginas interuiores como en tamaño (650 x 400 px). Lo que deseo es insertar texto informativo en las páginas interiores, pero es una buena cantidad de texto que si inserto en toda su extensión, haría que la página en sí, crezca en tamaño (ya no serían 650 x 400 px), por tal motivo, deseo incluir scroolbars en la parte donde se encuentra el texto, de esta manera, la página queda del mismo tamaño y la persona que desea leer solo mueve el scrool hacia arriba o abajo.

Algo como lo que encuentran en esta página, en el link ¨ABOUT¨(hagan click en ¨ABOUT¨): http://www.maddenmedia.com/maddenmedia/index_html.html

Gracias por su ayuda muchachos.
  #2 (permalink)  
Antiguo 06/03/2003, 13:50
Avatar de claroscuro  
Fecha de Ingreso: septiembre-2002
Ubicación: lima - Perú
Mensajes: 55
Antigüedad: 21 años, 6 meses
Puntos: 1
amigo, una forma facil de hacerlo es usar iframes, aunke la direcion ke diste usa algun tipo de javascript, si usas iframes aqui te dejo una breve explikacion

primero creas una tabla donde va a ir tu texto

de ahi solo le agregas ese codigo

Código:
<iframe name="contenido" src="tu pagina.htm" width="320" height="240"
 marginwidth="50" marginheight="50" frameborder="0"> 
 Tu navegador no soporta iframes </iframe>
donde

src="tu pagina.htm" es la pagina que vas a llamar (en esta pag, solo deberia el texto)

width="320" height="240" son alto y ancho de la ventana modificala a tu gusto.

y eso es todo.

ahoara solo el texto se va a mover.

saludos
__________________
Esta noche cenaremos en el infierno

Última edición por claroscuro; 06/03/2003 a las 13:54
  #3 (permalink)  
Antiguo 06/03/2003, 14:40
Avatar de Clicker  
Fecha de Ingreso: febrero-2003
Mensajes: 51
Antigüedad: 21 años, 1 mes
Puntos: 0
Pregunta

Hola, gracias por tu ayuda claroscuro. Me ha servido mucho, el punto al que deseaba llegar es el mismo, mas mi idea era poner como scrollbar, no la típica barra de windows, sino, deseo personalizar la barra, como la del ejemplo que puse.

Muchas gracias!!!
  #4 (permalink)  
Antiguo 06/03/2003, 15:08
Avatar de ej1236  
Fecha de Ingreso: noviembre-2002
Ubicación: Chemax Yucatan Mexico
Mensajes: 113
Antigüedad: 21 años, 4 meses
Puntos: 0
ESTE ES EL CODIGO DEL SITIO
ESPERO TE SIRVA ASI TAL Y COMO ESTABA EN EL SITIO


<html>
<head>
<title></title>

<style type="text/css">
#divUpControl{position:absolute; width:366; left:132; top:95; z-index:11; text-align: right}
#divDownControl{position:absolute; width:366; left:132; top:206; z-index:11; text-align:

right}
#divContainer{position:absolute; width:366; height:91; overflow:hidden; top:115; left:132;

clip:rect(0,366,91,0); visibility:hidden}
#divContent{position:absolute; top:0; left:0}
</style>
<script language="JavaScript">
<!--




// begin absolutely positioned scrollable area object scripts
function verifyCompatibleBrowser(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;

this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new verifyCompatibleBrowser()


var speed=170

var loop, timer

function ConstructObject(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'


this.el=bw.dom?document.getElementById(obj):bw.ie4 ?document.all[obj]:bw.ns4?eval(nest+'docum

ent.'+obj):0;


this.css=bw.dom?document.getElementById(obj).style :bw.ie4?document.all[obj].style:bw.ns4?eva

l(nest+'document.'+obj):0;
this.scrollHeight=bw.ns4?this.css.document.height: this.el.offsetHeight
this.clipHeight=bw.ns4?this.css.clip.height:this.e l.offsetHeight
this.up=MoveAreaUp;this.down=MoveAreaDown;
this.MoveArea=MoveArea; this.x; this.y;
this.obj = obj + "Object"
eval(this.obj + "=this")
return this
}
function MoveArea(x,y){
this.x=x;this.y=y
this.css.left=this.x
this.css.top=this.y
}

function MoveAreaDown(move){
if(this.y>-this.scrollHeight+objContainer.clipHeight){
this.MoveArea(0,this.y-move)
if(loop) setTimeout(this.obj+".down("+move+")",speed)
}
}
function MoveAreaUp(move){
if(this.y<0){
this.MoveArea(0,this.y-move)
if(loop) setTimeout(this.obj+".up("+move+")",speed)
}
}

function PerformScroll(speed){
if(initialised){
loop=true;
if(speed>0) objScroller.down(speed)
else objScroller.up(speed)
}
}

function CeaseScroll(){
loop=false
if(timer) clearTimeout(timer)
}
var initialised;
function InitialiseScrollableArea(){
objContainer=new ConstructObject('divContainer')
objScroller=new ConstructObject('divContent','divContainer')
objScroller.MoveArea(0,0)
objContainer.css.visibility='visible'
initialised=true;
}
// end absolutely positioned scrollable area object scripts
//-->
</script>
</head>
<body bgcolor="#ffffff" marginwidth="0" link="#999966" vlink="#999966" alink="#999966"

marginheight="0" BOTTOMMARGIN="0" LEFTMARGIN=0 TOPMARGIN=0

onLoad="InitialiseScrollableArea();">



<!-----scroll text------>
<!-- begin absolutely positioned scrollable area object-->
<div id="divUpControl" style="left: 173px; top: 91px"> <a href="javascript:;"

onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()"><img

src="../html_version/images/about/about_arrow_up.gif" border="0"></a>
</div>
<div id="divDownControl" style="left: 175px; top: 168px"> <a href="javascript:;"

onMouseOver="PerformScroll(7)" onMouseOut="CeaseScroll()"><img

src="../html_version/images/about/about_arrow_down.gif" border="0" width="47"

height="23"></a>
</div>
<div id="divContainer" style="left: 133px; top: 106px; width: 359px; height: 72px">
<div id="divContent">

EN ESTA PARTE VA EL CONTENIDO DE TU PAGINA

</div>
</div>
<!-- end absolutely positioned scrollable area object -->

</body>
</html>
__________________
-------------------------------
>> EJ1236...
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:25.