gifje op pagina plaatsen, fixed

Status
Niet open voor verdere reacties.

justinos

Gebruiker
Lid geworden
12 nov 2004
Berichten
199
Hoi allemaal,

Op mijn website zit ik het met volgende probleem:

VB.PNG


De achtergrond van de pagina/het frame bevat rechtsonderin nog een stukje van de lay out. Het is, vind ik, vrij slordig als de foto's op de pagina er dan overheen scrollen (zoals je al ziet op bovenstaand plaatje). Nu zoek ik een manier om dit probleem te verhelpen. Zo heb ik van het stukje lay out rechtsonderin een gif plaatje gemaakt (met de zwarte kleur transparant) en dat gif plaatje via een div code op de juiste positie te zetten. Echter met div codes scrollt het plaatje dan weer mee naar boven, de fixed code wordt namelijk niet ondersteund door Internet Explore 6.0.

Dit is het gif plaatje, hier hebben jullie niks van nodig maar even om mijn verhaaltje te verduidelijken:

rad.gif


Is er nu een andere manier om dat gif plaatje eroverheen te krijgen zodat het net is of de tekst achter het stukje lay out door scrollt?

Hoop dat jullie mijn verhaaltje snappen!
Alvast bedankt in ieder geval!!

Groet,
Justin
 
Laatst bewerkt:
justinos,
Probeer dat eens met de Z-index, Op de link hieronder een mooi voorbeeld.
http://www.sitemasters.be/?pagina=tutorials/tutorials&cat=2&id=210
ofwel met div in css
Code:
#plaatje{
position:fixed;
top;300px;/*of de plaats waar het plaatje moet komen (top of bottom)*/
left:250px;/* of de plaats waar het plaatje moet komen (left of rigth)*/
}
en dan in je pagina
Code:
 <div id= "plaatje">
<img scr="rad.gif">
</div>
 
Laatst bewerkt:
Dank voor de hulp. Helaas werkt ook dit niet. Wanneer ik dit toepas blijft het plaatje linksboven in de pagina staan, en dus geen positionering. Zal waarschijnlijk komen doordat Internet Explore ook dit niet ondersteund ? :(
 
PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
  <title>Fixed - Egel 070512 ;)</title>
  <style type="text/css">
   html, body { margin: 0px; width: 100%; height: 100%; padding: 0px; overflow: hidden;}
   #scroll { height: 100%; width: 100%; overflow-y: scroll;}
   #bottom { background: #feb; height: 50px; width: 50px; position: absolute; bottom: 0px; right: 24px;}
  </style>
 </head>
 <body>
  <div id="scroll">Scroll
   <br><br><br><br><br><br><br><br> 1 -------- <br><br><br><br><br><br><br><br> 2 --------
   <br><br><br><br><br><br><br><br> 3 -------- <br><br><br><br><br><br><br><br> 4 --------
   <br><br><br><br><br><br><br><br> 5 -------- <br><br><br><br><br><br><br><br> 6 --------
   <br><br><br><br><br><br><br><br> 7 -------- <br><br><br><br><br><br><br><br> 8 --------
  </div>
  <div id="bottom">Bottom</div>
 </body>
</html>
Het 'fixed' plaatje plaats je in de bottom-div en de inhoud van de pagina in de scroll-div. :)


Vr.Gr. Egel.
 
Dit werkt!! Na lang zoeken eindelijk een oplossing. Bedankt egel :thumb:
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan