Luis: Bewegte Layer

Beitrag lesen

SELF-Forum

Bewegte Layer

Luis
– Informationen zu den Bewertungsregeln

Moin,

ich möchte ein Bild in einer Website zur Seite Bewegen (mit onclick). Dies funktioniert leider nicht und mein JavaScript-Debugger zeigt auch nicht an. Ich hoffe ihr könnt mir helfen.

HTML

  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
    <title>Navigations-Frame</title>  
    <meta http-equiv="content-type" content="text/html; charset=us-ascii" />  
    <meta name="generator" content="Webocton - Scriptly (www.scriptly.de)" />  
    <link rel="stylesheet" type="text/css" href="navi.css" />  
    <script language="javascript" type="text/javascript" src="Drive.js"></script>  
  
</head>  
  
<body>  
    <img src="logo_navi.png" alt="Logo" id="pl"/>  
    <img src="w.gif" id="w1" alt=""/>  
    <img src="w.gif" id="w2" alt=""/>  
    <img src="b1.png" id="kue" alt="" name="kue" onclick="LinksFahren()"/>  
    <img src="b2.png" id="ein" alt="" name="ein" />  
    <img src="b3.png" id="moe" alt="" name="moe" />  
    <img src="b4.png" id="ges" alt="" name="ges" />  
    <img src="b5.png" id="and" alt="" name="and" />  
</body>  
</html>

JavaScript: Drive.js

  
function LinksFahren(X, Y) {  
// X = ID des Tags; Y = Gewünschte Position  
    var FahrLayer = document.getElementById(X);  
    var layerPosition = parseInt(FahrLayer.style.left);  
    if (layerPosition < Y) {  
        FahrLayer.style.left = (layerPosition - 5) + "px";  
        setTimeout("LinksFahren(X, Y)", 20);  
    }  
}

CSS: navis.css

  
img {  
width: 60px;  
position: absolute;  
top: 110px;  
}  
  
html, body {  
padding: 0;  
margin: 0;  
background-image: url(hintergrund_grau.png); /*Korrekte Farbdarstellung!!!*/  
}  
  
img#pl {  
position: absolute;  
top: 20px;  
right: 23px;  
height: 70px;  
width: auto;  
}  
  
img#w1{  
position: absolute;  
top: 127px;  
width: 100%;  
height: 1px;  
}  
  
img#w2{  
position: absolute;  
top: 105px;  
width: 100%;  
height: 1px;  
}  
  
#kue{  
left: 1190px;  
background-color: red;  
}  
  
#ein {  
right: 110px;  
}  
  
#moe {  
right: 190px;  
}  
  
#ges {  
right: 270px;  
}  
  
#and {  
right: 350px;  
}

Danke im Vorraus
Luis

Beitrag melden
–
Informationen zu den Bewertungsregeln