Ik zou graag een afbeelding boven de startpagina zetten , met deze code lukt het via een knop en een onClick maar
het zou moeten werken als de pagina word geladen dus met onLoad maar het het lukt mij niet en weet ook niet of dit wel kan.
code in body
<STYLE type="text/css">
.OKknop {
background-color: #FFFF00;
border-color: #996600;
border-style: outset;
border-width: 2px;
font-color: #996600;
font-size: 9pt;
font-family: arial;
width: 70px;
height: 20px;
}
.alertTitel {
background-color: #996600;
font-family: arial;
font-size: 9pt;
color: #FFFFFF;
font-weight: bold;
}
.alertBericht {
font-family: arial;
font-size: 9pt;
color: #000000;
font-weight: normal;
}
.alertVenster {
cursor: default;
filter: alpha(opacity=98);
background-color: #FFCC00;
position: absolute;
top: 200px;
left: 200px;
width: 100px;
height: 50px;
visibility:hidden; z-index: 999;
border-style: outset;
border-width: 1px;
border-color: #996600;
text-align: center;
}
</STYLE>
<div id="alertLayer" class=alertVenster></div>
<script type="text/javascript">
function BrowserCheck() {
var b = navigator.appName;
if (b == "Netscape") this.b = "NS";
else if (b == "Microsoft Internet Explorer") this.b = "IE";
else this.b = b;
this.v = parseInt(navigator.appVersion);
this.NS = (this.b == "NS" && this.v>=4);
this.NS4 = (this.b == "NS" && this.v == 4);
this.NS5 = (this.b == "NS" && this.v == 5);
this.IE = (this.b == "IE" && this.v>=4);
this.IE4 = (navigator.userAgent.indexOf('MSIE 4')>0);
this.IE5 = (navigator.userAgent.indexOf('MSIE 5')>0);
if (this.IE5 || this.NS5) this.VER5 = true;
if (this.IE4 || this.NS4) this.VER4 = true;
this.OLD = (! this.VER5 && ! this.VER4) ? true : false;
this.min = (this.NS||this.IE);
}
is = new BrowserCheck();
alertBox = (is.VER5) ? document.getElementById("alertLayer").style
: (is.NS) ? document.layers["alertLayer"]
: document.all["alertLayer"].style;
function verbergAlert(){
alertBox.visibility = "hidden";}
<!-- In dit gedeelte kun je de afbeelding aanpassen: <img src=...> -->
function maakAlert(aTitle,aMessage,bMessage){
document.all.alertLayer.innerHTML = "<table border=0 width=100% height=100%>" +
"<tr height=5><td colspan=4 class=alertTitel>" + " " + aTitle + "</td></tr>" +
"<tr height=5><td width=5></td></tr>" +
"<tr><td width=5></td><td width=20 align=left><img src='gifsindex/dagvandehond.gif'></td><td align=left class=alertBericht>" + aMessage + "<BR>" + bMessage +"</td><td width=5></td></tr>" +
"<tr height=5><td width=5></td></tr>" +
"<tr><td width=5></td><td colspan=2 align=center><input type=button value='OK' onClick='verbergAlert()' class=OKknop><BR></td><td width=5></td></tr>" +
"<tr height=5><td width=5></td></tr></table>";
thisText = aMessage.length;
if (aTitle.length > aMessage.length){ thisText = aTitle.length; }
aWidth = (thisText * 5) + 80;
aHeight = 100;
if (aWidth < 150){ aWidth = 200; }
if (aWidth > 350){ aWidth = 350; }
if (thisText > 60){ aHeight = 110; }
if (thisText > 120){ aHeight = 130; }
if (thisText > 180){ aHeight = 150; }
if (thisText > 240){ aHeight = 170; }
if (thisText > 300){ aHeight = 190; }
if (thisText > 360){ aHeight = 210; }
if (thisText > 420){ aHeight = 230; }
if (thisText > 490){ aHeight = 250; }
if (thisText > 550){ aHeight = 270; }
if (thisText > 610){ aHeight = 290; }
alertBox.width = aWidth;
alertBox.height = aHeight;
alertBox.left = (document.body.clientWidth - aWidth)/2;
alertBox.top = (document.body.clientHeight - aHeight)/2;
alertBox.visibility = "visible";
}
</script>
<center>
<INPUT TYPE=button value="Klik hier voor een voorbeeld." onClick="maakAlert('Hier komt de titel van jouw alert-venster','Hier schrijf je jouw bericht.','De kleuren en de afbeelding kies je zelf.');">
</center>
het zou moeten werken als de pagina word geladen dus met onLoad maar het het lukt mij niet en weet ook niet of dit wel kan.
code in body
<STYLE type="text/css">
.OKknop {
background-color: #FFFF00;
border-color: #996600;
border-style: outset;
border-width: 2px;
font-color: #996600;
font-size: 9pt;
font-family: arial;
width: 70px;
height: 20px;
}
.alertTitel {
background-color: #996600;
font-family: arial;
font-size: 9pt;
color: #FFFFFF;
font-weight: bold;
}
.alertBericht {
font-family: arial;
font-size: 9pt;
color: #000000;
font-weight: normal;
}
.alertVenster {
cursor: default;
filter: alpha(opacity=98);
background-color: #FFCC00;
position: absolute;
top: 200px;
left: 200px;
width: 100px;
height: 50px;
visibility:hidden; z-index: 999;
border-style: outset;
border-width: 1px;
border-color: #996600;
text-align: center;
}
</STYLE>
<div id="alertLayer" class=alertVenster></div>
<script type="text/javascript">
function BrowserCheck() {
var b = navigator.appName;
if (b == "Netscape") this.b = "NS";
else if (b == "Microsoft Internet Explorer") this.b = "IE";
else this.b = b;
this.v = parseInt(navigator.appVersion);
this.NS = (this.b == "NS" && this.v>=4);
this.NS4 = (this.b == "NS" && this.v == 4);
this.NS5 = (this.b == "NS" && this.v == 5);
this.IE = (this.b == "IE" && this.v>=4);
this.IE4 = (navigator.userAgent.indexOf('MSIE 4')>0);
this.IE5 = (navigator.userAgent.indexOf('MSIE 5')>0);
if (this.IE5 || this.NS5) this.VER5 = true;
if (this.IE4 || this.NS4) this.VER4 = true;
this.OLD = (! this.VER5 && ! this.VER4) ? true : false;
this.min = (this.NS||this.IE);
}
is = new BrowserCheck();
alertBox = (is.VER5) ? document.getElementById("alertLayer").style
: (is.NS) ? document.layers["alertLayer"]
: document.all["alertLayer"].style;
function verbergAlert(){
alertBox.visibility = "hidden";}
<!-- In dit gedeelte kun je de afbeelding aanpassen: <img src=...> -->
function maakAlert(aTitle,aMessage,bMessage){
document.all.alertLayer.innerHTML = "<table border=0 width=100% height=100%>" +
"<tr height=5><td colspan=4 class=alertTitel>" + " " + aTitle + "</td></tr>" +
"<tr height=5><td width=5></td></tr>" +
"<tr><td width=5></td><td width=20 align=left><img src='gifsindex/dagvandehond.gif'></td><td align=left class=alertBericht>" + aMessage + "<BR>" + bMessage +"</td><td width=5></td></tr>" +
"<tr height=5><td width=5></td></tr>" +
"<tr><td width=5></td><td colspan=2 align=center><input type=button value='OK' onClick='verbergAlert()' class=OKknop><BR></td><td width=5></td></tr>" +
"<tr height=5><td width=5></td></tr></table>";
thisText = aMessage.length;
if (aTitle.length > aMessage.length){ thisText = aTitle.length; }
aWidth = (thisText * 5) + 80;
aHeight = 100;
if (aWidth < 150){ aWidth = 200; }
if (aWidth > 350){ aWidth = 350; }
if (thisText > 60){ aHeight = 110; }
if (thisText > 120){ aHeight = 130; }
if (thisText > 180){ aHeight = 150; }
if (thisText > 240){ aHeight = 170; }
if (thisText > 300){ aHeight = 190; }
if (thisText > 360){ aHeight = 210; }
if (thisText > 420){ aHeight = 230; }
if (thisText > 490){ aHeight = 250; }
if (thisText > 550){ aHeight = 270; }
if (thisText > 610){ aHeight = 290; }
alertBox.width = aWidth;
alertBox.height = aHeight;
alertBox.left = (document.body.clientWidth - aWidth)/2;
alertBox.top = (document.body.clientHeight - aHeight)/2;
alertBox.visibility = "visible";
}
</script>
<center>
<INPUT TYPE=button value="Klik hier voor een voorbeeld." onClick="maakAlert('Hier komt de titel van jouw alert-venster','Hier schrijf je jouw bericht.','De kleuren en de afbeelding kies je zelf.');">
</center>