[CSS] mozilla.. overflow en clip doen het half - Softwareontwikkeling

woensdag 26 juni 2002 21:22

Acties:

Topicstarter

http://jeroen.concept-q.com/me/pics.html

In iexplore gedraagd het zich netjes, maar in mozilla niet... Die rekt de tabel uit.. (waar dus een textje
staat dat omhoog komt) Textje laat hij wel niet zien.. maar hij maakt de tabel cell wel ruimer om het textje erin
te laten passen..
overflow:hidden en een clipping rectangle zorgen erwel voor dat je verder niets van de div ziet.. maar het onzichtbare
gedeelte rekt de cell uit..
css en div spul dat in een table cell staat :

code:

resp += '\
        <div id=_c'+i+' onclick=hideColor('+i+') onmouseover=showText('+i+') onmouseout=hideText('+i+')  style="position:relative;top:0px;left:0px;width:'+WIDTH+'px;height:'+HEIGHT+'px;overflow:hidden;z-index:25">\
        <div style="position:absolute;top:0px;left:0px;width:'+WIDTH+'px;height:'+HEIGHT+'px;overflow:hidden;clip:rect(0px, 200px, 300px, 0px)">\
        <div id=_bw'+i+' style="position:absolute;top:0px;left:0px;visibility:visible;z-index:0;width:'+WIDTH+'px;height:'+HEIGHT+'px">\
        [img]'+loadingIm.src+'[/img]\
        </div>\
        <div id=_color'+i+' style="position:absolute;top:0px;left:0px;visibility:hidden;z-index:1;width:'+WIDTH+'px;height:'+HEIGHT+'px">\
        [img]'+loadingIm.src+'[/img]\
        </div>\
        <div class=caption id=_text'+i+' style="position:absolute;top:0px;left:0px;visibility:hidden;z-index:2;width:'+WIDTH+'px;height:auto">\
        '+pics[i].text+'\
        </div>\
        <div class=captionNoAlpha id=_textOverlay'+i+' style="position:absolute;top:0px;left:0px;visibility:hidden;z-index:4;width:'+WIDTH+'px;height:auto">\
        '+pics[i].text+'\
        </div>\
        </div>\
        </div>';

Volgens mij zie ik iets over het hoofd ofzo...
En ja.. ik kan ook gewoon geen table gebruiken en de posities gewoon absoluut zetten...
maar dat lost het probleem niet op..

plaatje van wat mozilla ervan bakt:
Afbeeldingslocatie: http://members.lycos.nl/wonderfully/got/voorbeeld.gif

Afbeeldingslocatie: http://members.lycos.nl/wonderfully/got/voorbeeld.gif

plaatje van wat iexplore.. zoals ik het dus wil:
Afbeeldingslocatie: http://members.lycos.nl/wonderfully/got/voorbeeld_ok.gif

donderdag 27 juni 2002 01:05

Acties:

ajvdvegt

Hee man, cool effect! Kan je niet even de borders aan zetten zodat wij die randjes ook kunnen zien? Het ziet er nu allemaal prima uit in Mozilla, alleen de tekste bij de derde foto past net niet.

En heb je niet toevallig last van 'collapsing borders'? Die ondersteunt Mozilla namelijk niet, en IE wel. Volgens W3C ou je die ook moeten ondersteunen, en zou het zelfs standaard aan moeten staan - wat bij IE dus ook het geval is.
Zie dit voor meer info.

I don't kill flies, but I like to mess with their minds. I hold them above globes. They freak out and yell "Whooa, I'm *way* too high." -- Bruce Baum

donderdag 27 juni 2002 08:46

Acties:

Verwijderd

Op donderdag 27 juni 2002 01:05 schreef ajvdvegt het volgende:
En heb je niet toevallig last van 'collapsing borders'? Die ondersteunt Mozilla namelijk niet,

oh ja? Mozilla ondersteund die dus echt wel.

Verder zie ik met Mozilla 1.1 Alpha geen enkel verschil tussen Mozilla en IE 6
Met welke versie van Mozilla heb je getest?

donderdag 27 juni 2002 11:45

Acties:

Norjee

Topicstarter

Sorry.. met borders uit zie je het idd niet.. omdat ik valign op top gezet heb...

Ik heb de borders nu aan, en je ziet het effect..

Met 1 rij kun je het dus oplossen door die valign=top, maar zodra je twee rijen hebt is het waardeloos.. (ik heb er ook maar even 2 rijen van gemaakt)

Ook in Mozilla 1.1a rekken de cellen uit...

donderdag 27 juni 2002 12:27

Acties:

Verwijderd

code:

<html>

<head>
<script language=javascript src=js.js></script>
<link rel=stylesheet type=text/css href=style.css>
<head>
<body bgcolor=black>
<center>
<table border=1 cellpadding=10 cellspacing=10>
    <script language=javascript>createPics()</script>
</table>
</center>

</body>
<script language=javascript>testFun()</script>

</html>

waar zijn je tabel cellen/rows? <center> is deprecated dus niet meer gebruiken

waar is je DOCTYPE ? je hebt geen width gedefineerd in je tabel, laat staan dat je uberhaupt tabelcellen hebt met een width. Ook heb je de head tag er 2 x instaan oftewel niet afgesloten, deze code is een rommeltje... back to the drawingboard

fout:

code:

1	<script language=javascript></script>

goed:

code:

1	<script type="text/javascript"></script>

vrijdag 28 juni 2002 01:41

Acties:

Norjee

Topicstarter

Dat language in een script tag niet goed was wist ik niet

Voor de rest maakt het allemaal niks uit..

Er zijn wel degelijk td's en die hebben ook een hoogte.. maar ze rekken nog steeds uit..

vrijdag 28 juni 2002 07:20

Acties:

Dennis

Shadow3333:
goed:
code:
1
<script type="text/javascript"></script>

code:

1	<script language="JavaScript" type="text/javascript"></script>

dinsdag 2 juli 2002 19:16

Acties:

Norjee

Topicstarter

* kick *

is dit dan helemaal onmogelijk?? Het is toch raar dat ondanks overflow = hidden en een clip rechthoek, de tabel cel wordt geresized naar het niet zichtbare deel van de div..

Ik heb het nu wel werkend in mozilla.. maar op een bijzonder slordige manier (tabel maken met transparante images, als tabel klaar is positie bepalen van de images, dan nieuwe div aanmaken in de body.. deze precies over de images in de tabel leggen, en hier dan de code voor de echte plaatjes inzetten)

zonder kunsten voor mozilla:
http://jeroen.concept-q.com/me/pics.html
(javascript: http://jeroen.concept-q.com/me/js.js)

met kunsten:
http://jeroen.concept-q.com/me/pics_moz.html
(javascript: http://jeroen.concept-q.com/me/js_moz.js)

dinsdag 2 juli 2002 20:07

Acties:

mulder

ik spuug op het trottoir

een <br /> achter een img wil nog wel eens helpen.

oogjes open, snaveltjes dicht

dinsdag 2 juli 2002 20:32

Acties:

Norjee

Topicstarter

<br /> Maakt niks uit..

Om het nog duidelijker te maken heb ik even een simpele pagina gemaakt, zonder javascript:

http://members.lycos.nl/condemn/probleem/test.html

dinsdag 2 juli 2002 20:40

Acties:

mulder

ik spuug op het trottoir

Misschien: als je margin of padding gebruikt telt mozilla dit bij de width of height op!

oogjes open, snaveltjes dicht

dinsdag 2 juli 2002 20:58

Acties:

Norjee

Topicstarter

Nope.. das het probleem niet.. thanx anyway