Jag har sökt och sökt men inte hittat någon lösning på problemet!
Jag har en hemsida som är uppbyggd med en massa tabeller och divar. Nu vill jag lägga en div ovanpå hela sidan. Denna div skall alltså täcka sidan 100% i bredd och 100% i höjd.
Det är ju inte speciellt svårt att att få diven att täcka den delen av sidan som för tillfället syns på skärmen, men när man scrollar nedåt.....
Finns det någon vänlig själ där ute som kan hjälpa mig och ge ett konkret exempel på hur jag kan göra?
Finns javascript som fixar det men då kommer den inte ligga helt still när man skrollar. Den kommer att hoppa medans man skrollar.
Har inte fått det att fugnera helt med CSS. Antingen är det FF eller IE som kan positionera den med X/Y-kordinater för den synliga ytan, den andre tar efter dokumentet.
<script>
/* Floating Mail-This-Link Script C.2004 by CodeLifter.com */
// Insert the entire script just before the </body> tag.
// Set the following two position parameters
// Negative numbers are relative to right (hX) or bottom (vY)
// Positive numbers are relative to left (hX) or (vY) top
// Experiment with values to get positioning exact, and allow
// for the dimensions of the image & form in the positioning
</script>
<!-- Edit the HTML between the div tags to suit your design //-->
<div id="FloatMail" style="position: absolute;
background-color: #ffffff;
width: 654px;
height: 36px;
overflow-y: hidden;
">Innehåll</div>
<!-- End of editable HTML //-->
<script>
/* Floating Mail-This-Link Script C.2004 by CodeLifter.com */
/* Caution! Do not allow linebreaks other than where shown */
var moveSpeed=.9999999;/*moveSpeed from 0.0 to 1.0. 1 means move direct. lower number means slower move speed*/
var nn=(navigator.appName.indexOf("Netscape")!=-1);
var dD=document,dH=dD.html,dB=dD.body,px=dD.layers?'':'px';
var hX = 180;
var vY = -36;
function floatMail(iX,iY,id)
{
var L=dD.getElementById?dD.getElementById(id):dD.all?dD.all[id]:dD.layers[id];
this[id+'O']=L;
if(dD.layers)
{
L.style=L;
}
L.nX=L.iX=iX;
L.nY=L.iY=iY;
L.P=function(x,y)
{
this.style.left=x+px;this.style.top=y+px;
};
L.Fm=function()
{
var pX, pY;
pX = (this.iX >=0)?0:nn?innerWidth:nn&&dH.clientWidth?dH.clientWidth:dB.clientWidth;
pY = nn?pageYOffset:nn&&dH.scrollTop?dH.scrollTop:dB.scrollTop;
if(this.iY<0)
{
pY += nn?innerHeight:nn&&dH.clientHeight?dH.clientHeight:dB.clientHeight;
}
this.nX += moveSpeed*(pX+this.iX-this.nX);
this.nY += moveSpeed*(pY+this.iY-this.nY);
this.P(this.nX,this.nY);
setTimeout(this.id+'O.Fm()',33);
};
return L;
}
floatMail(hX,vY,'FloatMail').Fm();
</script>
Jag har en hemsida som är uppbyggd med en massa tabeller och divar. Nu vill jag lägga en div ovanpå hela sidan. Denna div skall alltså täcka sidan 100% i bredd och 100% i höjd.
Hmm...
Har du en länk till sidan och lite fler detaljer?
Om det du vill åstadkomma är en bakgrund som täcker allt utrymme "under" en befintlig sida kan det finnas fler än ett sätt att angripa problemet (och några av de bästa metoderna utifrån det du skrivit är redan föreslagna i tråden)
Det skulle helt klart bli lättare att föreslå en lösning på ditt problem om man inte behöver gissa sig till varför vissa metoder inte funkar för dig ;)
Hmm, jag har inte så mkt att visa mer än de förslag som kommit upp här i tråden. Sidan är inte byggd ännu... Jag vill veta om detta går att åstadkomma först.
Helt enkelt, jag vill ha en div som lägger sig över allt på sidan. Även det innehåll som kommer "under scrollen".
Jag får bara inte ihop att du vill ha en "div som lägger sig över" och att du samtidigt skall ha den till en bakgrund - men jag kanske missuppfattade just den kommentaren ? :)
body { margin:0; position:relative; /* body blir containing block (istället för att fönstret är containing block) */ }
#divsomliggeroverallt { position:absolute; top:0; left:0; width:100%; height:100%; background-color:lime; }
body { margin:0; position:relative; /* body blir containing block (istället för att fönstret är containing block) */ }
#divsomliggeroverallt { position:absolute; top:0; left:0; width:100%; height:100%; background-color:lime; }
Titta, det tycks funka!
Tack zcorpan.
Kan jag "lita" på detta nu då? Jag har testat i FF, IE och Opera och i dessa webbläsare ser det fint ut.
jarvklo: Det är en bakgrund utan någon förgrund om man så säger. Bakgrund kanske är fel ord då... ;)
