H-indietro H-pausa H-avanti ------ V-indietro V-pausa V-avanti

<a href="javascript:ScrollBackward(newHorizScrollLayer, 150, 1)"> H-indietro </a> 
<a href="javascript:PauseScroll(newHorizScrollLayer)"> H-pausa </a> 
<a href="javascript:ScrollForward(newHorizScrollLayer, 150, 1)"> H-avanti </a> 
------
<a href="javascript:ScrollBackward(newVertScrollLayer, 200, 25)"> V-indietro </a> 
<a href="javascript:PauseScroll(newVertScrollLayer)"> V-pausa </a> 
<a href="javascript:ScrollForward(newVertScrollLayer, 200, 25)"> V-avanti </a>

<SCRIPT LANGUAGE="JavaScript">
<!--

// Information container for a ScrollLayer
function ScrollStruct(objName, layerID, xPos, yPos, orientation, visibleSize)
{
this.name          = objName;
this.layerID       = layerID;
this.xPos          = xPos;
this.yPos          = yPos;
this.orientation   = orientation;
this.visibleSize   = visibleSize;
this.clipOffsetPos = 0; // Relative from LEFT if "Horiz", TOP if "Vert" 
this.dist          = 0;
this.speed         = 0;
this.stopPoint     = 0;
this.intervalID    = 0; // For setInterval and clearInterval
this.scrolling     = false; 
}

//**************************************************************
//
// function ScrollLayer()
//
// The ScrollLayer function moves the clip to the offset
// location stored in "clipOffsetPos" relative to the layer
// in either the horizontal or vertical direction depending
// on the "orientation" of the layer.
//
//
//  DEBUG INFO
//  ADD: Need to add Netscape support (Currently supports IE5+).
//
//**************************************************************
function ScrollLayer(scrollStruct)
{
var width   = parseInt(document.all[scrollStruct.layerID].style.width);
var height  = parseInt(document.all[scrollStruct.layerID].style.height);

if (scrollStruct.clipOffsetPos + scrollStruct.speed >= 0
&& scrollStruct.clipOffsetPos + scrollStruct.speed + scrollStruct.visibleSize
<= (scrollStruct.orientation == "Horiz" ? width : height))
{
scrollStruct.clipOffsetPos += scrollStruct.speed;

// Check for stop points
if (scrollStruct.speed > 0
&& scrollStruct.dist*(scrollStruct.stopPoint+1) >= scrollStruct.clipOffsetPos - scrollStruct.speed
&& scrollStruct.dist*(scrollStruct.stopPoint+1) <= scrollStruct.clipOffsetPos)
{
scrollStruct.stopPoint += 1;
clearInterval(scrollStruct.intervalID);
scrollStruct.scrolling = false;
}
else if (scrollStruct.speed < 0
&& scrollStruct.dist*(scrollStruct.stopPoint-1) >= scrollStruct.clipOffsetPos
&& scrollStruct.dist*(scrollStruct.stopPoint-1) <= scrollStruct.clipOffsetPos - scrollStruct.speed)
{
scrollStruct.stopPoint -= 1;
clearInterval(scrollStruct.intervalID);
scrollStruct.scrolling = false; 
}

// Create and display the clip in the approppriate location
// if the position of the clip remains inside the layer.
// clip: rect(top right bottom left)
if (scrollStruct.orientation == "Horiz")
{
document.all[scrollStruct.layerID].style.posLeft = scrollStruct.xPos - scrollStruct.clipOffsetPos;
document.all[scrollStruct.layerID].style.posTop  = scrollStruct.yPos; 
document.all[scrollStruct.layerID].style.clip    = "rect(auto " + (scrollStruct.clipOffsetPos + scrollStruct.visibleSize) + "px auto " + scrollStruct.clipOffsetPos + "px)";
}
else if (scrollStruct.orientation == "Vert")
{
document.all[scrollStruct.layerID].style.posLeft = scrollStruct.xPos;
document.all[scrollStruct.layerID].style.posTop  = scrollStruct.yPos - scrollStruct.clipOffsetPos;
document.all[scrollStruct.layerID].style.clip    = "rect(" + scrollStruct.clipOffsetPos + "px auto " + (scrollStruct.clipOffsetPos + scrollStruct.visibleSize) + "px auto)"; 
}
else return;
document.all[scrollStruct.layerID].style.visibility = "visible"; 
}
else 
{
clearInterval(scrollStruct.intervalID);
scrollStruct.scrolling = false;
}
}

// Methods to perform on a Scroll Layer
function ScrollForward(scrollStruct, dist, speed)
{
    if (!scrollStruct.scrolling)
{
scrollStruct.dist       = dist;
scrollStruct.speed      = speed;
scrollStruct.scrolling  = true;
scrollStruct.intervalID = setInterval("ScrollLayer(" + scrollStruct.name + ")", 1);
}
}
function ScrollBackward(scrollStruct, dist, speed)
{
    if (!scrollStruct.scrolling)
{
scrollStruct.dist       = dist;
scrollStruct.speed      = -speed;
scrollStruct.scrolling  = true; 
scrollStruct.intervalID = setInterval("ScrollLayer(" + scrollStruct.name + ")", 1);
}
}
function PauseScroll(scrollStruct)
{
clearInterval(scrollStruct.intervalID);
scrollStruct.scrolling = false;
}
//-->
</SCRIPT>

<div id="myHorizScrollLayer" style="z-index:1; width:1000px; height:75px; visibility:hidden; position:absolute">
  <nobr>
    <img src="/js/pic1.gif" width="100" height="75">
    <img src="/js/pic2.gif" width="100" height="75">
    <img src="/js/pic3.gif" width="100" height="75">
    <img src="/js/pic4.gif" width="100" height="75">
    <img src="/js/pic1.gif" width="100" height="75">
    <img src="/js/pic2.gif" width="100" height="75">
    <img src="/js/pic3.gif" width="100" height="75">
    <img src="/js/pic4.gif" width="100" height="75">
    <img src="/js/pic1.gif" width="100" height="75">
  </nobr>
</div>
<SCRIPT>

</SCRIPT>

<div id="myVertScrollLayer" style="z-index:2; width:75px; height:1000px; visibility:hidden; position:absolute">
<table>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
  <tr><td><img src="/js/pic1.gif" width="100" height="75"></td></tr>
</table>
</div>
<SCRIPT>

</SCRIPT>

SCARICA