[JS] Fade werkt niet zonder position

[semicon]

Hallo,
Ik heb nu dit onderstaand scriptje zelf geschreven en toegepast op een <div>, met style posistion: absolute; en dan werkt het als ik dus met een onclick FoldMenu() aanroep dat hij langzaam visible word.

Ik wil alleen geen <div> het is zo walgelijk dat je daar die positie moet instellen, en het kan overigens niet eens normaal op de plek waar ik hem wil.

Is er een ander element die op "filters.alpha.opacity" gedoe wel werkt?
Of kan er nog een eigenschap ingesteld worden dat het wel werkt?

Bron

code:

function FoldMenu() {
    state = document.getElementById("menu").style.visibility;
    if(state == "hidden") {
        document.getElementById("menu").style.visibility = "visible";
        goFade = 0;
        goFadeIn();
    }
    else {
        document.getElementById("menu").filters.alpha.opacity = 0;
        document.getElementById("menu").style.visibility = "hidden";
    }
}

function goFadeIn() {
        document.getElementById("menu").filters.alpha.opacity = goFade;
        goFade = goFade+5;
        goIn = setTimeout("goFadeIn()", 30);
        if(goFade >= 100) {
            clearTimeout(goIn);
            goFade = 0;
        }
}

* Geprobeerd
<div style="position:fixed;">
<div style="position:absolute;">
<div style="position:relative;">
<span>
en gezocht op google

[BtM909]

Ik hoor voor het eerst dat het alleen werkt op gepositioneerde div

[semicon]

als ik die andere op position doe, krijg ik geen foutmelding maar hij laat gewoon ".filters.alpha.opacity" niet zien al zet je hem handmatig op 30 ofzo

[BtM909]

Mijn russisch is niet al te best, maar dit werkt toch ook voor jou?

http://exper.ural.ru/0069.phtml

[semicon]

heb je het weer

position: absolute;
zei ik dus al

[BtM909]

semicon schreef op 11 februari 2004 @ 17:06:
heb je het weer

position: absolute;
zei ik dus al

Sorry... Ik zei al m'n russisch is niet zo best ..

[glashio]

BtM909 schreef op 11 februari 2004 @ 17:05:
Mijn russisch is niet al te best, maar dit werkt toch ook voor jou?
http://exper.ural.ru/0069.phtml

Voor mij wel!! Ik Dank U!!!

[semicon]

Ik denk dat het niet anders kan dan met een <div> k** k** k**

[semicon]

Is het niet mogelijk dan op een andere manier?

Ik heb namelijk een pagina die altijd in het midden zit, en moet dus bovenaan een menu krijgen, dus met div valt waarschijnlijk af anders moet je erg k*****.

Het is text, dus mischien weet iemand oplossing?

[crisp]

relatieve container:

HTML:

<div style="position:relative">
  <div style="position:absolute">
    tralalalala
  </div>
</div>

[semicon]

Nope, shit werkt ook niet

als ik hier een td heb bijv.

code:

_______________________________
|                |             |
|          td    |     td  2   |
|________________|_____________|

dan moet in die 2e TD de text kunnen faden

[crisp]

semicon schreef op 11 februari 2004 @ 17:26:
Nope, shit werkt ook niet

als ik hier een td heb bijv.

code:

_______________________________
|                |             |
|          td    |     td  2   |
|________________|_____________|

dan moet in die 2e TD de text kunnen faden

ja? dat is toch niet zo moeilijk? Wat ik wou laten zien is dat je een element best op een bepaald punt in de flow absoluut kan positioneren door ervoor te zorgen dat z'n parent een relatief gepositioneerd element is...

[semicon]

crisp schreef op 11 februari 2004 @ 17:30:
[...]

ja? dat is toch niet zo moeilijk? Wat ik wou laten zien is dat je een element best op een bepaald punt in de flow absoluut kan positioneren door ervoor te zorgen dat z'n parent een relatief gepositioneerd element is...

Waarom werkt het dan niet?

Ik d8 voorheen namelijk dat dat ook zo was

[crisp]

semicon schreef op 11 februari 2004 @ 17:32:
[...]


Waarom werkt het dan niet?

Ik d8 voorheen namelijk dat dat ook zo was

Geen idee; ik kan je code vanaf hier namelijk niet zien

[semicon]

code:

<div style="position:relative;">
    <div id="menu" style="visibility:hidden;position:absolute;">
        Blaat &nbsp;&nbsp;&nbsp;
        Blebb0 &nbsp;&nbsp;&nbsp;
        Text1 &nbsp;&nbsp;&nbsp;
    </div>
</div>

No problem u name it ill get it..

[crisp]

volgens mij krijg je een JS-error omdat je dit nog toe moet voegen aan de style van je menu-div:

code:

filter:alpha(opacity=0)

offtopic:
je weet ook dat dit IE-only is?

[semicon]

filter:alpha(opacity=0)


dit dat ik in mijn style.css staan, maar ik denk aan de offtopic opmerking ,
dat ik een manier moet hebben die beter werkt, want we komen er volgens mij niet uit

[Johnny]

Ik heb ooit eens ontdekt dat je in MSIE alleen de opacity van elementen kunt instellen waarvan je een width en/of height hebt ingesteld.

Op deze pagina, onder het kopje "MSIE warning" kun je zien wat ik bedoel.

http://www.brainerror.net/scripts_js_blendtrans.php

[crisp]

semicon schreef op 11 februari 2004 @ 17:56:
filter:alpha(opacity=0)


dit dat ik in mijn style.css staan, maar ik denk aan de offtopic opmerking ,
dat ik een manier moet hebben die beter werkt, want we komen er volgens mij niet uit

nee, je moet 'm inline hebben staan wil je in JS via filters.alpha.opacity kunnen werken, anders moet je het via de style property doen.
Als ik de JS neem uit je 1e post, en in de body dit zet:

HTML:

<div style="position:relative;">
    <div id="menu" style="visibility:hidden;position:absolute;filter:alpha(opacity=0)">
        Blaat    
        Blebb0    
        Text1    
    </div>
</div>
<br /><br /><br />
<input type="button" value="doet maar" onclick="FoldMenu()" />

dan werkt het prima...

[ Voor 4% gewijzigd door crisp op 11-02-2004 19:18 ]

[Clay]

Dat ligt aan een IE bedenksel dat "layout" heet. Een element heeft "layout" als het width, height, position, writing-mode of nog wat anders heeft. Dan pas kunnen dingen als filters (en ook VML etc.) toegepast worden. De zin ontgaat me daarvan, maar het is niet anders.

Op msdn staat hier ook ergens wat over ff zoeken. brb.

[edit, gevonden]

http://msdn.microsoft.com.../properties/haslayout.asp

[ Voor 18% gewijzigd door Clay op 11-02-2004 19:27 ]