Hola,
Estoy diseñando una web a partir de sectores de una imágen con Photoshop y Image Ready, el texto quería que estuviera en una capa y que se moviera arriba y abajo a través de dos imágenes (flechas). Creía que esto era imposible viendo la dificultat de scroll de texto, pero en un for vi a un webmaster hablando de su Scroll de su página:
http://www.vinasdelvero.com/espanol/1_1bodega.html
Y esto es lo que quiero para la mía. He intentado aplicar el script de la página y me ha salido esto:
<html>
<head>
<style type="text/css">
#divContainer {LEFT: 373px; VISIBILITY: hidden; OVERFLOW: hidden; WIDTH:450px; CLIP: rect(0px 450px 220px 0px); POSITION: absolute; TOP: 133px; HEIGHT: 220px}
#divContent {LEFT: -7px; POSITION: absolute; TOP: -12px}
</style>
<script language="javascript" src="scripts.js"></script>
<script language="javascript">
function initScroll(){
InitialiseScrollableArea('divContainer','divConten t')
}
</script>
</head>
<body onLoad="initScroll()">
<table></table>
<td colspan="8"><a href="#" onmouseover="PerfomScroll(-5);MM_swapImage('sroll_subir','','imagen.gif',1)" onmouseout="CeaseScroll();MM_swapImgRestore()"><im g name="scroll_subir" src="imagen _b.gif" width="407" height="39" border="0"></a></td>
<td colspan="7"><a href="#" onMouseOver="PerfomScroll(5);MM_swapImage('scroll_ bajar','','imagen2.gif',1)" onMouseOut="CeaseScroll();MM_swapImgRestore()"><im g name="scroll_bajar" src="imagen2_b.gif" width="407" height="39" border="0"></a></td>
</tr></tr>
</table>
<div id="divContainer" name="divContainer" style="visibility: visible">
<div id="divContent" name="divContent">texto</div>
</div>
</body>
</html>
La página a la cual se vincula (llamada script.js) la he cojido de dicha página (para después de ver como funciona hacer la mía propia!), que contiene todo esto (entre más cosas, pero creo que son las partes útiles para el scroll...no?...):
//---------------------------SCROLLES----------------------------
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=50
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+'document.'+obj):0;
this.css=bw.dom?document.getElementById(obj).style :bw.ie4?document.all[obj].style:bw.ns4?eval(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(divContainer,divContent,d ivContenido){
objContainer=new ConstructObject(divContainer,'',divContenido)
objScroller=new ConstructObject(divContent,divContainer,divConteni do)
objScroller.MoveArea(0,0)
objContainer.css.visibility='visible'
initialised=true;
} */
function InitialiseScrollableArea(divContainer,divContent){
objContainer=new ConstructObject(divContainer)
objScroller=new ConstructObject(divContent,divContainer)
objScroller.MoveArea(0,0)
objContainer.css.visibility='visible'
initialised=true;
}
function displayStatusMsg(msgStr) {
status=msgStr;
document.returnValue = true;
}
//------------------------------------------------------------------------------
function hidealllayers(myLayer){
if (isIE()) {
myLayers=handleAllTags("div";
for(i=0; i<myLayers.length; i++){
MM_showHideLayers(myLayers.id,"","hide";
}
}
else{
n = 1;
tmpLayer = "Layer" + n;
tmpLayerObj = MM_findObj(tmpLayer);
while (true) {
tmpLayer = "Layer" + n;
tmpLayerObj = MM_findObj(tmpLayer);
MM_showHideLayers(tmpLayer,"","hide";
n++;
if (tmpLayerObj == undefined){
break;
}
}
}
if (!myLayer==""{
MM_showHideLayers(myLayer,"","show";
}
}
//------------------------------------------------------------------------------
function strReplaceAll(str,strFind,strReplace)
{
var returnStr = str;
var start = returnStr.indexOf(strFind);
while (start>=0)
{
returnStr = returnStr.substring(0,start) + strReplace + returnStr.substring(start+strFind.length,returnStr .length);
start = returnStr.indexOf(strFind,start+strReplace.length) ;
}
return returnStr;
}
//------------------------------------------------------------------------------
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//------------------------------------------------------------------------------
function openWindow(myFile,w,h){
//myObj = MM_findObj("imagenEnLayer";
//myFile = extractFile(myObj.href);
h=h+20;
w=w+20;
myWin=window.open("","IMAGEN","resizable=no,width= "+w+",height="+h);
txt="<html> <head> <title>'IMAGEN'</title></head> <body bgcolor='#FFFFFF'><img id='dummyImg' src='../shared/imagenes/" + myFile + "' ></body></html>";
myWin.document.write(txt);
window.close();
}
Por supuesto a mi no me funciona y no se ver porqué y cada día me siento más perdido entre tanto script y scroll pero me gustaría saber hacerlo sinceramente, aunque un pepino sabe más que yo en cuanto Script...
Espero que me puedan ayudar en algo si saben otro script que tenga la misma función. Gracias
pd: Perdón por meter tantos caracteres...
pd2: No piensen que voy robando códigos html de todas las páginas, solo cuando me llaman la atención lo analizo para ver como se hacen las cosas...
1 Saludo y gracias.