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";
}
}
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";
}
}