Sliding layer problem

admin

Administrator
Staff member
Hello all, I have a problem with sliding layer. I am calling a function, that slides a layer every 5 seconds. When the layer is slided to the page, there is an option to slide it back. Then it just disappears, that is ok. But the thing is, that I want it to start at the same positioin again. But after I click to slide it back, next time it starts on positions 0,0, I am pasting the code in here. Can anyone help me with this?

Thanks a lot ,

Mike

code:

<html>

<head>
<script language=javascript>
<!--
window.setInterval("startSlide('ass');",5000);
//-->
</script>
<SCRIPT language=JavaScript src=http://www.webdeveloper.com/forum/archive/index.php/"Diary/JavaScript/PopUpAttention.js" type=text/javascript></SCRIPT>


<style type="text/css">
.launch{position: absolute;left: 590px;top: 545px;z-index: 1;}
</style>
</head>
<body leftmargin="0" topmargin="3" marginwidth="0" marginheight="0">

<DIV ID="launch" class="launch" STYLE="
WIDTH:200px;
HEIGHT:100px;
BACKGROUND-COLOR: #FEF7ED;
LAYER-BACKGROUND-COLOR: #FEF7ED;
BORDER: #52819F;
BORDER-STYLE: solid;
BORDER-WIDTH: thin;
PADDING: 10px;
VISIBILITY:hidden;
">
</DIV>

</body>
</html>

javascript file=====
keyFrame = 0;

keyFrameBack = 0;

movingObjLeft = new Array(1);
movingObjTop = new Array(1);
movingObjLeftBack = new Array(1);
movingObjTopBack = new Array(1);

movingObjLeft[0] = new Array(590,590,590,590,590,590,590,590,590,590,590,590,590,590,590,590);
movingObjTop[0] = new Array(545,535,525,515,505,495,485,475,465,455,445,435,425,415,405,395);

movingObjTopBack[0] = new Array(395,405,415,425,435,445,455,465,475,485,495,505,515,525,535,545);
movingObjLeftBack[0] = new Array(590,590,590,590,590,590,590,590,590,590,590,590,590,590,590,590);

function startSlide(SoapResults)
{

document.getElementById('launch').innerHTML = "<span class=TextNormal>"+SoapResults+"</span><br><A HREF='http://www.webdeveloper.com/forum/archive/index.php/#' onClick='startSlideBack(); return true' >Slide layer back</A>";
document.getElementById('launch').posLeft = 590;
document.getElementById('launch').posTop = 545;
ShowPopUpAttention();
setTimeout("slideTheObject()", 100);


}


function startSlideBack()
{

document.all.launch.style.posLeft = 590;
document.all.launch.style.posTop = 545;
document.all.launch.style.visibility = "hidden";
//setTimeout("slideTheObjectBack()",100)

}

function slideTheObject()
{

var whichOne;
whichOne = document.all.launch.style;
whichOne.posLeft = movingObjLeft[0][keyFrame];
whichOne.posTop = movingObjTop[0][keyFrame];

keyFrame++;

if(keyFrame < movingObjLeft[0].length && keyFrame < movingObjTop[0].length)
setTimeout("slideTheObject()",100);

}

function slideTheObjectBack()
{
var whichOne;

whichOne = document.all.launch.style;
whichOne.posLeft = movingObjLeftBack[0][keyFrameBack];
whichOne.posTop = movingObjTopBack[0][keyFrameBack];

keyFrameBack++

if (keyFrameBack < movingObjLeftBack[0].length && keyFrameBack < movingObjTopBack[0].length)
setTimeout("slideTheObjectBack()",100);

if (whichOne.posTop == 545){

document.getElementById('launch').posLeft = 590;
document.getElementById('launch').posTop = 545;
HidePopUpAttention();

}

}

function HidePopUpAttention(){

if (document.getElementById) {
document.getElementById('launch').style.visibility = "hidden";
}
else if (document.all) {
document.all['launch'].style.visibility = "hidden";
}
else if (document.layers) {
document.layers['launch'].visibility = "hidden";
}

}

function ShowPopUpAttention(){

if (document.getElementById) {
document.getElementById('launch').style.visibility = "visible";
}
else if (document.all) {
document.all['launch'].style.visibility = "visible";
}
else if (document.layers) {
document.layers['launch'].visibility = "visible";
}

}
 
Back
Top