Hallo,
ein paar Fragen..
Wie kann ich verhindern das die function bei mehrfachaufruf mit dem letzten i ausgeführt wird?
Wie kann ich die div's (bei mehrfachklick) genau so possitionieren und steuern, ohne das sie sich hintereinander anstauen, sondern untereinander anreihen und nachrutschen.
Joa das sind die wichtigsten..
Hier das Problem:
http://wolfts.no-ip.org/allertbox.html
Hier der Code zum spielen
http://jsfiddle.net/6mhHL/
Und hier der Code:
HTML
<body>
<article>
<h1>Try it out.</h1>
<button>Use the alert() command</button>
<button>Use the alert() too</button>
</article>
</body>JavaScript
var button;
window.onload=function(){
button = document.getElementsByTagName('button');
button[0].onclick = function(){
alert("Klicked 1");
}
button[1].onclick = function(){
alert("Klicked 2");
}
}
var box = [];
var i = 0;
function alert(msg){
i++;
box[i] = document.createElement( 'div' );
document.body.appendChild(box[i]);
box[i].setAttribute("name",i);
box[i].className = 'styled-al-box';
box[i].innerHTML = msg;
createKlick(i);
setTimeout("showAlert(i)", 300);
}
function showAlert(i){
box[i].style.opacity = 1;
setTimeout("moveAlert(i)", 6000);
}
function moveAlert(i){
box[i].style.top = "-200px";
box[i].style.opacity = 0;
setTimeout("delAlert(i)", 3000);
}
function delAlert(i){
box[i].remove();
}
function createKlick(i){
box[i].onclick = function(){
moveAlert(i);
}
}CSS
.styled-al-box{
color: rgba(0,0,0, 1);
background-color: rgba(255,255,255, .7);
width: 300px;
min-height: 100px;
border-radius: 3px;
box-shadow: 5px 5px 7px black;
position: absolute;
right: 40px;
top: 40px;
opacity: 0;
transition: opacity 3s, top 3s ease-in;
padding: 30px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}Hilfe wär voll cool 
