Placering af grafikstump

Hvis grafikken overlapper noget af det andet indhold på websiden, må den helst placere sig nedenunder og ikke ovenover!

Mon dette kan løse det?

<style type="text/css">
<!--
body {
background: url(bg.jpg) right bottom no-repeat fixed;
}
-->
</style>

ahv: Det er den løsning jeg selv har nu, problemet er bare, at så er det ikke klikbart (mangler link)!

Det skal bruges til at reklamere lidt for "mig" på en webside jeg har programmeret for nogle andre - en lille diskret reklame nede i hjørnet!

I see, den bliver ikke nem.

I know :-)

Ved ikke om det overhovedet kan løses, men hvis ikke får jeg sikkert også de næstbedste løsninger i dette spørgsmål - og så må det jo være fint!

hvis elementet skal stå fikseret i forhold til browservinduet (og ikke i forhold til siden) er det position: fixed, du skal have fat i. "fixed" vil sige at elementet bliver fastlåst i forhold til browservinduet uanset hvordan du scroller, dvs. elementet står stille mens alt andet scroller. men for at placere det i vinduets bottom/right hjørne er du nødt til at vide hvor stort brugerens vindue er i situationen. dertil skal du bruge værdierne "innerWidth" og "innerHeight" for Netscape, men "clientWidth" og "clientHeight" for IE. De to sæt mål, måler desværre ikke helt det samme. Du kan se en oversigt på en side, jeg har lavet: www.dahr.dk/Web/vinduesdimensioner.html Som du kan se forudsætter clientHeight også at du i forvejen har givet dit dokument en højde er udnytter hele vinduet og ikke bare strækker sig så langt ned som dokumentet nu er. Det kan du gøre med flg. style:

html, body {
  100%
}

Derefter skal selve placeringen af elementet jo bare være vinduets bredde / højde minus dimensionerne af dit element.

Det må da vist nogen lunde være princippet....

//mik

og til slut selvfølgelig:

#ditElement {
  postition: fixed;
  top: [vindueshøjde minus elementets højde];
  left [vinduesbredde minus elementets bredde];
}

ups - den sidste går jo ikke, det skal skrives i javascript, men det kan godt lade sig gøre...

og så jo selvfølgelig:

html, body {
  height: 100%;
}

Det med at ændre egenskaber for html og body er desværre ikke en mulighed :-/

jo det er ;-). hvis f.eks. du vil sikre dig højde på dine tabeller gør du det netop sådan. for alt hvad der angives på den vertikale axe skal have en højde at blive angivet i forholdt til. hvis html og body er 100% betyder det at dokumentet fylder hele vinduets højde. derefter kan andre elementer angives i forhold til body og så fremdeles. men derudover er der vist noget rod med det jeg skrev til dig. IE's clientHeight måler jo netop kun dokumentets (og ikke vinduets højde). Skal lige finde ud af hvad det så er for en værdi vi skal have fat i

Hmmm - det lyder da muligt at det kan løses pænt alligevel...

jeg har nu rettet i det dokument jeg nævnte før: www.dahr.dk/Web/vinduesdimensioner.html Det viser sig at hvis html og body angives til 100% så måler clientHeight den korrekte VINDUEShøjde fra øverst i dokumentet, men hvis scriptet er placeret nederst viser den højden fra dette punkt, dvs. fra DOKUMENTETS slutpunkt. Så hvis det er vinduets højde vi skal have skal målingen placeres øverst i dokumentet og i en eller anden variabel så vi kan få fat i tallet igen nederst i højre hjørne.

det enkleste er vel så at undlade at angive top og left for dit element i selve dit stylesheet, men først angive disse i tag'et. I stylesheetet kan du f.eks. have:

#mitLogo {
  postition: fixed;
  width: hvad-det-nu-er;
  height: hvad-det-nu-er;
}

Og så kan du skrive tag'et ud dynamisk med java script:

<script type="text/javascript"><!--
var IE = (document.all)?true:false;
var Gecko = (document.getElementById&&!document.all)?true:false;
if(IE){
document.write('<div id="mitLogo" style="top: '+([indsæt navnet på den variabel der måler højden fra toppen]-[indsæt højden af dit logo])+'; left: '+(document.body.clientWidth-[indsæt bredden af dit logo])+';"><img osv.></div>');
} else if(Gecko){
document.write('<div id="mitLogo" style="top: '+(innerHeight-[indsæt højden af dit logo])+'; left: '+(innerWidth[indsæt bredden af dit logo])+';"><img osv.></div>');
}
//--></script>

Sådan noget i den stil...

//mik

Det er slet ikke nødvendigt med java script:

<html>
<head>
    <title>Untitled</title>
</head>
<style type="text/css">
    html, body {
        height: 100%;
        width: 100%;
        border: none;
        margin: 0px;
    }

    #corner_link {
        position: absolute;
        top: 100%;
        left: 100%;
        width: 100px;
        height: 100px;
        border: 1px solid black;
        margin-left: -100px;
        margin-top: -100px;
    }
</style>
<body>
    <div id="corner_link"><a href="..."><img src="..."></a></div>
</body>
</html>

Og husk lige en doctype, det har jeg glemt!!

pixeldude> ja, du har ret hvis det er meningen at elementet skal være i bottom/right hjørnet af DOKUMENTET, men hvis det skal var af vinduet dur det da ikke. hvis nu dokumentet fylder mere i højden en vinduet, vil ikke kunne se elementet før man har scrollet ned til enden. jeg forstod tipsen på den måde at han ville have det til at være i nederste højre hjørne af VINDUET, også selv om dokumentet fylder mere.

tipsen> hvad mener du så?

mik789: Din fortolkning er den korrekte!

Ok, så er den jo fjong

jeg har flyttet den side med mål for vinduets dimensioner til:

www.e-tidsskrift.dk/dev/vinduesdimensioner.html

//mik

Er der nogen der har afprøvet flg.:

(Går ud fra at billedet er 80 x 32 pixels, og at det skal sidde 5px fra kanten i nederste højre hjørne af "VINDUET")

HTML:
<a id="pagemadeby" href="http://blablabl.dk"><img src="..." width="80" height="32" alt="Made by [logo]" title="Web page made by blablabla" border="0" /></a>

CSS:
#pagemadeby {
  display: block;
  width: 80px;
  height: 32px;
  bottom: 5px;
  right: 5px;
}

/CS

Ups - glemte position" - den er vigtig :-)

CSS:
#pagemadeby {
  display: block;
  position: absolute;
  width: 80px;
  height: 32px;
  bottom: 5px;
  right: 5px;
}

/CS

greystate> position vil være i forhold til den omgivende box hvad enten det er body (dvs. dokumentet) eller en anden div. det vil ikke være i forhold til vinduet. Vinduet er ikke repræsenteret i css som et element for sig da css jo ikke kan vide hvor stort det er hos brugeren i den aktuelle situation. derfor kræver alt der refererer til vinduet noget serverside script.

sådan må det da vist være rent logisk. eller hvad?

sludder - clientside script selvfølgelig!

mik789:
dette synes da at virke for mig ligemeget hvor det er placeret:

<style type="text/css">
.pic {
position: absolute;
right: 5px;
bottom: 5px;
width: 100px;
height: 100px;
}
</style>

og

<div class="pic"><a href="#"><img src="pic.jpg" style="width: 100px; height: 100px;" alt="" /></a></div>

i hvert fald ifølge mine tests :)

ups havde ikke læst det med at den skulle være statisk :)