«div widht=100%» nicht gleich 100%?
hambam
- css
0 Harald0 Oliver Koepler0 Thomas J.S.0 hambam
Hi !
Hab mal folgendes probiert:
<html>
<head>
<title>Vorhang neu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
<!--
.vorhang{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
layer-background-color:black;
background-color:black;
border:0.1px solid black;
}
-->
</style>
</head>
<body bgcolor="#AA0033" text="#CCCCCC" link="#FFCC00" vlink="#CCCCCC" alink="#CCCCCC">
<DIV id="vorhang" class="vorhang">test</DIV>
<br>
<br>
<center>
<p><font size="+5">DHTML</font></p>
<p><font color="#FFCC33" face="Arial, Helvetica, sans-serif"><b>Testseite1</b></font></p>
</center>
</body>
</html>
Eigentlich hätte ich erwartet, daß das Div sich über das gesamte Browserfenster erstreckt,
aber leider nicht. Der Netscape zeigt unten zwar einen vielleicht noch zu vernachlässigen
Rand an, aber rechts? Selbst bei einer festen Angabe von 1024 anstatt 100% war noch immer
ein fingerdicker Rand rechts zu sehen.
Warum? Jemadn eine Idee?
Danke für jeder Art von Hinweis
Hambam (ICQ 43807526)
Hi !
Hab mal folgendes probiert:
<html>
<head>
<title>Vorhang neu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
<!--
Versuche doch mal
<style type="text/css">
<!--
-->
</style>
zu nehmen. Wenn ich richtig liege, dürfte nichts von der angegebenen class genommen werden, da IMHO mit <style> </style> keine saubere Definition der CSS stattgefunden hat.
Gruß
Harald
Hi !
Tut mir leid, das bringt auch nichts..
Gruß
Harald
Hab übrigens das ganze jetzt auch mal mit dem IE probiert.
Ergebnis: bei den100% hat auch er einen sichtbaren Bereich, der so breit/schmal ist,
wie der netsi bei der 1024-Angabe.
Bei der 1024-Angabe klappts allerdings.
Wiedermal ein Pluspunkt für IE. (bitte keine Diskussionen)
Also ich weiß jetzt nimmer weiter, aber vielleicht gibts ja doch noch nen kleinen Trick?
Wäre echt schön!
Hambam (ICQ 43807526)
Hi !
Hab mal folgendes probiert:
<html>
<head>
<title>Vorhang neu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
<!--
.vorhang{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
layer-background-color:black;
background-color:black;
border:0.1px solid black;
}
-->
</style>
</head>
<body bgcolor="#AA0033" text="#CCCCCC" link="#FFCC00" vlink="#CCCCCC" alink="#CCCCCC">
<DIV id="vorhang" class="vorhang">test</DIV>
»»
»»
<center>
<font size="+5">DHTML</font></p>
<font color="#FFCC33" face="Arial, Helvetica, sans-serif"><b>Testseite1</b></font></p>
</center>
</body>
</html>Eigentlich hätte ich erwartet, daß das Div sich über das gesamte Browserfenster erstreckt,
aber leider nicht. Der Netscape zeigt unten zwar einen vielleicht noch zu vernachlässigen
Rand an, aber rechts? Selbst bei einer festen Angabe von 1024 anstatt 100% war noch immer
ein fingerdicker Rand rechts zu sehen.
Warum? Jemadn eine Idee?Danke für jeder Art von Hinweis
Hambam (ICQ 43807526)
Sehr spaßige Sache. Setze mal den Wert width über 100%, dann geht's. Bei 120% bleibt bei mir nur ein ca. 1cm breiter Rand. Weiter geht's dann leider auch nicht.......
Tschau
Oliver
Hallo!
Eigentlich hätte ich erwartet, daß das Div sich über das gesamte Browserfenster erstreckt, aber leider nicht. Der Netscape zeigt unten zwar einen vielleicht noch zu vernachlässigen Rand an, aber rechts? Selbst bei einer festen Angabe von 1024 anstatt 100% war noch immer ein fingerdicker Rand rechts zu sehen.
Warum? Jemadn eine Idee?
Ja. Das ist der Platzt des Scrollbalkens.
Dein div also nimmt wohl 100% der Breite des Anzeigefensters ein, was aber nicht die Scrollblaken und diverse Leisten inkludiert.
Du könntest mit Javascript deine CSS dynamisch schreiben:
Allerdings da verhalten sich beide Browser widerum unterschiedlich. Kein wirklich befriedigendes Egebnis.
Grüße
Thomas
<script language="JavaScript">
function bild(){
var x, y;
x = screen.availWidth;
y = screen.availHeight;
breite = x;
hoehe = y;
document.write("<style type="text/css">");
document.write(".vorhang{ position:absolute; left:0; top:0; width:"+breite+"; height:"+hoehe+"; layer-background-color:black; background-color:black; border:none; }");
document.write("</style>");
}
bild();
</script>
</head>
<body>
<DIV id="vorhang" class="vorhang">test</DIV>
Hi nochmal !
Hab mittlerweile mal die schönen Beispielscripte von gismo gefunden.
Da gibts die sogenannten Vorhänge, die sich langsam "aufziehen" und dann die eigentliche
Seite zu sehen ist.
Und genau diese Vorhänge gehen über die gesamte Breite, komplett!
Ich weiß nur nicht warum.
Vielleicht kann mal einer der Profis den Quelltext analysieren, warum da die divs über die
ganze Bildschirmbreite gehen.
Hier mal eins dieser Vorhänge:
<html>
<head>
<title>Vorhang 4</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
<!--
.gismo{
position:absolute;
left:0;
top:0;
layer-background-color:white;
background-color:white;
border:0.1px solid white;
}
-->
</style>
</head>
<body bgcolor="#000033" text="#CCCCCC" link="#FFCC33" vlink="#CCCCCC" alink="#CCCCCC">
<DIV id="i1" class="gismo"></DIV>
<DIV id="i2" class="gismo"></DIV>
<DIV id="i3" class="gismo"></DIV>
<DIV id="i4" class="gismo"></DIV>
<script language="JavaScript1.2">
//gismoFX
//http://www.gismo.at
var brzina=20
var trenutni=new Array()
var trenutni2=new Array()
if (document.layers){
for (i=1;i<=4;i++){
trenutni[i]=eval("document.i"+i+".clip")
trenutni2[i]=eval("document.i"+i)
trenutni[i].width=window.innerWidth
trenutni[i].height=window.innerHeight/4
trenutni2[i].top=(i-1)*trenutni[i].height
}
}
else if (document.all){
var clipright=document.body.clientWidth,clipleft=0
for (i=1;i<=4;i++){
trenutni[i]=eval("document.all.i"+i+".style")
trenutni[i].width=document.body.clientWidth
trenutni[i].height=document.body.offsetHeight/4
trenutni[i].top=(i-1)*parseInt(trenutni[i].height)
}
}
function otvori(){
window.scrollTo(0,0)
alert("Taste!");
if (document.layers){
for (i=1;i<=4;i=i+2)
trenutni[i].right-=brzina
for (i=2;i<=4;i=i+2)
trenutni[i].left+=brzina
if (trenutni[2].left>window.innerWidth)
clearInterval(zaustavi)
}
else if (document.all){
clipright-=brzina
for (i=1;i<=4;i=i+2){
trenutni[i].clip="rect(0 "+clipright+" auto 0)"
}
clipleft+=brzina
for (i=2;i<=4;i=i+2){
trenutni[i].clip="rect(0 auto auto "+clipleft+")"
}
if (clipright<=0)
clearInterval(zaustavi)
}
}
function gismoFX(){
zaustavi=setInterval("otvori()",100)
}
gismoFX()
</script>
<center>
<p> </p>
<p> </p>
<p><font size="+5">DHTML </font></p>
<p><font color="#FFCC33" face="Arial, Helvetica, sans-serif"><b>SLIDE FX 2</b></font></p>
<p> </p>
<p><b><font face="Arial, Helvetica, sans-serif">download the DHTML Script (zip)</font></b><font face="Arial, Helvetica, sans-serif"><br>
</font><font size="-1"><i>- G¿smo</i></font></p>
</center>
<p align="center">
</body>
</html>
Vielleicht ist da jetzt jemand (gismo?) der weiterhelfen kann. Wäre echt toll!
hambam