absoluut?

Status
Niet open voor verdere reacties.
J

jeel2008

Gebruiker
Lid geworden
30 okt 2008
Berichten
839
hallo,
ik heb een pagina op een site met daarop een image van een huis.
de ramen heb ik doorzichtig gemaakt , transparant.
dat huis staat in een div.

daaronder ligt nog een div.
hierop heb ik een marquee tag gezet.
er loopt een filmpje. steeds als er een foto achter een van de ramen langs passeert ,zie je m dus, want gedeelte op het image van het huis waar de ramen zitten zijn immers transparant.

so far, so good.

echter, nu de positionering. op mijn scherm klopt het, want ik heb de divs zelf geplaatst.
maar wat op een groter of kleiner scherm? hoe zorg ik ervoor dat de twee divs steeds precies goed liggen tov elkaar?
(als ze namelijk niet meer goed tov elkaar liggen verschijnen de plaatjes niet achter de raampjes).

bij voorbaat dank, jeel2008
 
Laatst bewerkt:
Daar heb je ongeveer 388 manieren voor :D
Oftewel: dat is zo heel moeilijk te zeggen, zonder 'n link naar waar het online staat.
Wat vaak wordt gedaan is 'n 'hoofd-div' met 'n position: relative;
En dan die andere twee divs daarin en absoluut positioneren ten opzichte van de 'hoofd-div'. Omdat ze dan allebei ten opzichte van dezelfde div zijn gepositioneerd, zijn ze in feite ook ten opzichte van elkaar gepositioneerd, ongeacht de grootte van het scherm en zo.
 
Ja, het schuift in Firefox, Google Chrome en Opera. Dan neem ik aan dat het overal in schuift. Leuk idee, trouwens.
De afbeelding met het huis is 1.05 MB groot. Dat is wel héééél erg groot. Alleen al door hem terug te brengen van 880x664 (de echte maat) naar 672x507 (maat waarin wordt weergegeven) wordt hij naar schatting 41% kleiner. Bovendien zijn browsers niet echt goed in verkleinen/vergroten van afbeeldingen.
 
huis

hallo goeroeboeroe,
ja, ik moet er nog wat aan knutselen, het ging tot nog toe vooral om het technische deel.

als dat staat wordt het pas weer leuk.

toch bedankt voor de tips

groeten jeel2008
 
In IE8 schuift het wel, maar niet mooi. hij schijft zeg maar naar het einde van het huis, verdwijnt dan plotseling volledig en komt dan weer van rechts binnen. In Opera schijft hij mooi helemaal door het huis heen voordat hij weer opnieuw verschijnt.
(natuurlijk moet IE weer wat roet in het eten gooien)
 
Ik moet IE 8 altijd apart opstarten en zo, draait nu eenmaal niet op Linux. Laat ik nou 'n één keertje denken "als 't werkt in Opera, Firefox en Google Chrome, dan zal 't toch ook wel werken in IE 8'.... 't Is toch niet te geloven :shocked:
 
Goeroeboeroe zei:
Ik moet IE 8 altijd apart opstarten en zo, draait nu eenmaal niet op Linux. Laat ik nou 'n één keertje denken "als 't werkt in Opera, Firefox en Google Chrome, dan zal 't toch ook wel werken in IE 8'.... 't Is toch niet te geloven :shocked:
Klik om te vergroten...
Gek genoeg doet hij het compatbiliteitsmodus wel goed, zag ik net. Volgens mij kun je je site IE laten vertellen die modus te gebruiken
 
Ja, dan moet je in de <head> toevoegen:
HTML: 
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
(of zonder / op 't eind als je html gebruikt, dit is voor xhtml).
Maar beter is als de JavaScript gewoon ook in IE 8 goed werkt, lijkt mij. Alleen is JavaScript dus niet mijn terrein.
 
HTML: 
In IE8 schuift het wel, maar niet mooi. hij schijft zeg maar naar het einde van het huis, verdwijnt dan plotseling volledig en komt dan weer van rechts binnen.

hallo naarling/ en goeroboeroe
bij mij schuift t in alle browser t zelfde (ff, ie, google chrome, opera): van rechts naar links tot ie verdwenen is, dan weer opnieuw.
dat zou misschien met javascript op te lossen zijn, maar dit is een marquee tag
<marquee> image </marquee>.
hoort volgens mij gewoon tot html


ps waar zitten die quotetekens toch om tekst tussen te plaatsen in een forumbericht?
 
Laatst bewerkt:
De quote-knop zit boven het tekstvenster. ALs je boven die knoppen gaat hangen, verschijnt er tekst bij. 't Is 't gele vierkantje met de punt rechtsonder, zoals tekst in 'n stripverhaal.

marqueel is geen html. Althans. Het werkt in alle browsers, maar is nooit onderdeel geweest van de standaard. Zoals jij 't gebruikt, is er niets op tegen. Maar meestal wordt 't ongelooflijk irritant gebruikt, net zoals blink. Dat is, neem ik aan, de reden dat 't nooit in de standaard is opgenomen, terwijl 't wel in alle browsers werkt.
In html5 zou het worden opgenomen, maar het is daar inmiddels gepromoveerd tot de status obsolete. Wel zielig, want het is dus al weggedonderd voor het ooit 'n status heeft gehad. (Hmmm, doet me aan mezelf denken :D ). css3 transitions en animations zijn beter, volgens w3c.
Alleen: marquee werkt in elke browser, en transitions en animations nog niet. Ook IE 9 heeft er geen plannen voor. (Het geroep dat IE 9 css 3 ondersteunt is echt absolute flauwekul: het gaat 2 of 3 dingen ondersteunen van de vele honderden nieuwe dingen. Maar de reclame-afdeling van Microsoft roeptoetert dit rond met de kreet: "IE 9 ondersteunt css 3".)
Dus daar heb je niets aan. Voor 't geval je belangstelling hebt hier het betreffende w3c-deel uit de standaard: http://www.w3.org/TR/html5/obsolete.html

Overigens zitten er nog wel wat fouten in je html: http://validator.w3.org/
Als je als doctype
HTML: 
<!DOCTYPE html>
<html lang="nl">
neemt, werkt de validator prettiger, want dan valideert hij op html 5 en krijg je dus geen foutmeldingen voor marquee.
 
Laatst bewerkt:
www.bluesfotos.nl

hallo naarling, goeroeboeroe,
ja naarling, ik zie nu wat je bedoelt, dat ie in IE niet mooi schuift, zie
http://www.bluesfotos.nl/

het zal ook niet eens NIET ie zijn dat loopt te klooien.
ik zie zo snel geen oplossing, hij nokt er gewoon mee terwijl de overige browsers alle fotootjes tonen

maar goed, het moet maar weer zo dan in IE
 
<offtipic>
hallo naarling, goeroeboeroe,
Klik om te vergroten...
Ik moet nog steeds regelmatig lachen om die naam naarling vanwege de context. Als je hier de komma was vergeten... :D
</offtopic>
 
een ongenaam mensch in de Haarlemmerhout

ja,

de naam ' Naarling '

doet me een beetje denken aan neef Nurks uit

Een Onaangenaam Mensch in de Haarlemmerhout
 
jeel2008 zei:
ja,

de naam ' Naarling '

doet me een beetje denken aan neef Nurks uit

Een Onaangenaam Mensch in de Haarlemmerhout
Klik om te vergroten...
Heh, verre familie misschien. Naarling was, geen idee waarom, het eerste woord dat bij me op kwam toen ik een gebruikersnaam moest verzinnen.
 
naam

bij mijzelf was dat Complete Loser
maar ja, dat staat ook weer zo bizar op een Forum

Complete Loser heeft een vraag
Complete Loser heeft gereageerd op je bericht

etc
 
IE werkt niet mee

hallo Naarling komma goeroeboeroe

na een heftige strijd heb ik toch het onderspit moeten delven tegen IE.
als je kijkt op www.bluesfotos.nl dan begint het inderdaad al, naarling, bij het filmpje. maar dat is nog maar een minor problem.

ga je naar fotos en dan naar stevie ray vaughan dan toont IE niet eens de thumbnails!
de andere browsers doen dat wel.

vraag: moet ik nu die hele jquery applicatie opnieuw bouwen of een andere zoeken? of is het een kleinigheidje?
 
Woeps!
De homepage met filmpje is niet helemaal een minor problem: bij een resolutie van 1024x768 gaat het copyright-regeltje straal over de raampjes met 't filmpje heen (in Firefox, enz.), of veroorzaakt tegelijk een stevige afwijking naar rechts met een horizontale scrollbar (in IE7). En in zo'n marquee zit een na de eerste ronde een lang grijs gat, voordat de tweede ronde begint, en verderop ook (FF en IE, enz.).

Maar om hier van problemen af te zijn: waarom maak je geen background-image van de filmstrook, die je dan met een simpel javascriptje laat afdraaien?
Het huis.gif bestand was 141kB, met veel omgevingsgrijs. Dit heb ik een kopje kleiner gemaakt door er een jpg van 56kB van te maken. Voor het transparante middendeel is dan nog een gifje van 17kB nodig. Winst: de helft van de oorspronkelijk bestandsgrootte. :)
  • Om een loze strook voor het middenstuk met de transparante raampjes te krijgen zijn het dak en het benedenstuk losgeknipt in twee aparte <div>'s en daarin als achtergrondfiguur gemonteerd.
  • Nu kan met het ene jpg'tje volsstaan worden.
  • Hiervan wordt eerst het dak geshowd, en later wordt ie gerecycled met d.m.v. de background-position alleen het onderstuk.
  • Het raampjes-deel van het huis is de raampjes-gif die in de html op de voorgrond staat.
  • Daarachter kan de filmstrook dan als achtergrond-image zijn kunsten vertonen.
Met vriendelijke groet,
CSShunter

PS:
De filmsnelheid kan je naar smaak aanpassen.

PS-extra:
Goeroe spatie Boer Oe? :D
 
tips

hallo csshunter,
bedankt voor de uitgebreide info.
hmmm, het was dus nogal een puinhoop.

met een horizontale scrollbar (in IE7
Klik om te vergroten...
is dit op te lossen door divs altijd 100% breed te maken, als je ze toch onder elkaar wilt weergeven en vermijden dat ze de divs naast elkaar komen. of altijd dsiplay: block te doen?

copyright-regeltje straal over de raampjes
Klik om te vergroten...
op te lossen met een 'sticky footer'?


ik snap wat je bedoelt; je hebt gewoon een blokkendoos van het huis gemaakt.
maar is het gevaar dan niet dat de blokken niet exact aansluiten op elkaar?


wat is trouwens: fallback voor scriptless? google levert niks op
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan