Toon posts:

[JS] Scrollbar verspringt in IE na zetten van opacity

Pagina: 1
Acties:

Onderwerpen


Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Ik heb wat gezocht maar kwam alleen maar resultaten tegen over het transparant maken van scrollbars en niet werkende layouts, maar deze bug is toch wat aparter:

Op mijn site heb ik op de achtergrond een plaatje dat 100% breed en hoog is. Ik laat deze dmv javascript steeds veranderen. Ik heb als overgang van het ene plaatje naar het andere een fade in en out. Werkt in alle browsers perfect, zelfs het mooist in IE.
Maar bij IE gebeurt er iets vreemds. Zodra je de opacity verandert, verspringen de scrollbars in divs. Er is er nu slechts 1 zichtbaar, maar het gebeurt ook als ik er een andere div bijzet met een andere id. Het maakt ook niet uit wat ik fade, die scrollbar blijft verspringen. De inhoud van de div vreemd genoeg niet.

Check (in IE): OUD

Dit is het fade script:

code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function fade(id,theStart,theEnd,theDuration) {
    theSpeed = Math.round(theDuration/100);
    theTimer = 0;
    if (theStart > theEnd) {
        for (i=theStart;i>=theEnd;i--) {
            theOpacity = i/100;         
            setTimeout("document.getElementById('"+id+"').style.filter = 'alpha(opacity="+i+")';",(theTimer * theSpeed));
            setTimeout("document.getElementById('"+id+"').style.opacity = "+theOpacity+";",(theTimer * theSpeed));
            theTimer++;
        }
    } else if (theStart < theEnd) {
        for(i=theStart;i<=theEnd;i++) {
            theOpacity = i/100;         
            setTimeout("document.getElementById('"+id+"').style.filter = 'alpha(opacity="+i+")';",(theTimer * theSpeed));
            setTimeout("document.getElementById('"+id+"').style.opacity = "+theOpacity+";",(theTimer * theSpeed));
            theTimer++;
        }
    }
}


en dit is de css voor de div waarbij de scrollbar verspringt:

code:
1
2
3
4
5
6
7
8
9
10
    position:absolute;
    top:185px;
    right:0;
    height:131px;
    border:1px hidden;
    border-right:none;
    margin:0 117px 14px 14px;
    padding:0 14px 0 0;
    overflow:auto;
    z-index:4;


Ik heb het vermoeden dat er ergens misschien een gereseveerd woord wordt gebruikt, en dat IE daarom zo raar doet. Maar ik heb niks kunnen vinden.

Iemand een idee?

Acties:
  • 0 Henk 'm!

Verwijderd

Topicstarter
Ik heb het dmv een iframe opgelost. Niet de handigste manier, maar het werkt nu wel.