Hallo Zusammen!
Ich habe versucht mit Youtube eine Slideshow für meine HP zu erstellen, leider zeigt er die Bilder nicht an. ;(
Kann mir jemand helfen??
Hier der Code:
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Ohne_Titel_1</title>
<script type="text/javascript">
var bild1 = new image();
bild1.scr = 'bild1.jpg';
var bild2 = new image();
bild2.scr = 'bild2.jpg';
var bild3 = new image();
bild3.scr = 'bild3.jpg';
var bildoben = 0;
var bildunten = 1;
var op = 1;
var op_ie =100;
var diebilder= new Array('image/bild1.jpg','image/bild2.jpg','image/bild3.jpg');
var lang = diebilder.length;
function slider(){
var rahmen1 = document.getElementById('bild1');
var rahmen2 = document.getElementById('bild2');
rahmen1.src = diebilder[bildoben];
rahmen2.src = diebilder[bildunten];
rahmen1.style.opacity = '1';
rahmen1.style.filter = 'alpha(opacity=100)';
bildoben++;
bildunten++;
if(bildoben+1) == lang {
bildunten = 0;
}
if (bildoben == lang && bildenunten == 1){
bildoben = 0;
bildunten = 1;
}
window.setTimeout("slidemove()",3000);
}
function slidemove(){
if(op > 0) {
op = op - 0.1;
op_ie = op_ie - 10;
document.getElementById('bild1'.style.opacity = op;
document.getElementById('bild1'.style.opacity = 'alpah(opacity=' + op_ie + ')';
window.setTimeout("slidemove()",100);
}
else {
op = 1;
op_ie = 100;
window.setTimeout("slider()",0);
}
}
-->
</script>
<style type="text/css">
.auto-style1 {
margin-left: 0px;
}
</style>
</head>
<body onload="slider()">
<div style="width:600px;height:338px;border:4px solid green;">
<img id="bild1" style="position:absolute;z-index:2;opacity:1;filter:alpha(opacity=100); left: 14px; top: 19px;" src="" width="auto" height="148"/>
<img id="bild2" style="position:absolute;z-index:1;opacity:1;filter:alpha(opacity=100); left: 84px; top: 19px;" src="" width="297" height="229" class="auto-style1"/>
</div>
</body>
</html>
Ich habe versucht mit Youtube eine Slideshow für meine HP zu erstellen, leider zeigt er die Bilder nicht an. ;(
Kann mir jemand helfen??
Hier der Code:
<!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>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Ohne_Titel_1</title>
<script type="text/javascript">
var bild1 = new image();
bild1.scr = 'bild1.jpg';
var bild2 = new image();
bild2.scr = 'bild2.jpg';
var bild3 = new image();
bild3.scr = 'bild3.jpg';
var bildoben = 0;
var bildunten = 1;
var op = 1;
var op_ie =100;
var diebilder= new Array('image/bild1.jpg','image/bild2.jpg','image/bild3.jpg');
var lang = diebilder.length;
function slider(){
var rahmen1 = document.getElementById('bild1');
var rahmen2 = document.getElementById('bild2');
rahmen1.src = diebilder[bildoben];
rahmen2.src = diebilder[bildunten];
rahmen1.style.opacity = '1';
rahmen1.style.filter = 'alpha(opacity=100)';
bildoben++;
bildunten++;
if(bildoben+1) == lang {
bildunten = 0;
}
if (bildoben == lang && bildenunten == 1){
bildoben = 0;
bildunten = 1;
}
window.setTimeout("slidemove()",3000);
}
function slidemove(){
if(op > 0) {
op = op - 0.1;
op_ie = op_ie - 10;
document.getElementById('bild1'.style.opacity = op;
document.getElementById('bild1'.style.opacity = 'alpah(opacity=' + op_ie + ')';
window.setTimeout("slidemove()",100);
}
else {
op = 1;
op_ie = 100;
window.setTimeout("slider()",0);
}
}
-->
</script>
<style type="text/css">
.auto-style1 {
margin-left: 0px;
}
</style>
</head>
<body onload="slider()">
<div style="width:600px;height:338px;border:4px solid green;">
<img id="bild1" style="position:absolute;z-index:2;opacity:1;filter:alpha(opacity=100); left: 14px; top: 19px;" src="" width="auto" height="148"/>
<img id="bild2" style="position:absolute;z-index:1;opacity:1;filter:alpha(opacity=100); left: 84px; top: 19px;" src="" width="297" height="229" class="auto-style1"/>
</div>
</body>
</html>