html5 div fade probleem (IE)

[roeni1]

Ik heb een stukje code aangepast en nu werkt de fade van artikel 1 naar artikel 2 niet meer in IE.

url voor voorbeeld:
http://geelmedia.com/vivace/

ik heb de code ergens vandaan en daar werkt het wel. IK heb er nu een DIV bij geplaatst en het werkt niet meer,

Zie screenshot.

Rechts de HTML pagina met de regel geselecteerd die ik toegevoegd heb en wanneer ik die weghaal dat het wel werkt.
Links de js file.

klik voor een grotere afbeelding:



Please help

[ Voor 18% gewijzigd door roeni1 op 11-08-2013 19:53 ]

[NMe]

En nu moeten we met een slecht leesbare screenshot en een testcase zelf maar uit gaan zoeken welke code relevant is? Post eens de relevante code hier in het topic. Daarbij doe je niet eens de moeite om te omschrijven wat "werkt het niet meer" betekent. Lees De Quickstart eens door en pas je startpost aan, want hier kunnen we niets mee.

[roeni1]

De afbeelding is aanklikbaar zoals omschreven in de FAQ. Ik zal dat bij de afbeelding plaatsen.

wat niet meer werkt is: "fade van artikel 1 naar artikel 2 in IE"
onderin mn post is te lezen wat wat er niet klopt aan mn code. Ik weet alleen niet wat ik eraan kan doen.

Zou zeer fijn zijn om een goede kant opgeduwd te worden.

[ Voor 21% gewijzigd door roeni1 op 11-08-2013 19:55 ]

[NMe]

Het zou zeer fijn zijn als je daadwerkelijk meer info geeft. Post de relevante code als tekst in dit topic. Niet als plaatje. En zeg eens wát er precies niet werkt en wat er wel gebeurt. Of je een foutmelding krijgt. Of er iets anders gebeurt dan je verwacht. Of dat er iets anders aan de hand is. We moeten het nu maar even raden...

[ Voor 45% gewijzigd door NMe op 11-08-2013 20:03 ]

[Verwijderd]

NMe schreef op zondag 11 augustus 2013 @ 19:56:
Post de relevante code als tekst in dit topic. Niet als plaatje.

Dat zeg je nu ik net bijna alles heb overgetikt?

[jostefa]

Bij mij werkt hij wel in ie onder windows 8. Je jQuery is trouwens niet de meest recente maar hier zal het denk ik niet aan liggen.

[roeni1]

Bedankt voor alle reacties. Mijn excuses als je de code aan het overtypen was
Ik heb het nu getest met Win7 en IE10 en daar gaat het niet goed.

Ik heb hier een zip bestand staan met alle files.
http://geelmedia.com/vivace/Vivace.zip

Het gaat om:
- index.html
- css.css
- js/scripts840f.js

wat er niet goed gaat is:

Indien er van positie 1 (cirkel onderin) overgegaan wordt naar positie 2.
In Chrome e.d. wordt de box die onder het logo staat uitgefade en de box die bij positie 2 hoort ingeladen.
Bij IE zijn die transities echter hard. geen fade alleen een visible off en visible on van de volgende.

Ik hoop dat ik het zo beter omschreven heb.

[ Voor 5% gewijzigd door roeni1 op 11-08-2013 20:26 ]

[NMe]

...nee. Relevante code is niet hetzelfde als alle code. Die hadden we ook uit je site kunnen halen. Post nou gewoon online een paar regels code waarin het probleem volgens jou zit. Verwacht je nou echt dat we ál je code gaan doorspitten? Heb je die quickstart die ik linkte überhaupt doorgelezen?

[roeni1]

De relevante code:

HTML: index.html

  <div id="home">
    <div id="blok1" role="main">
      <div id="welcome">
        <ol class="slider">
          <li id="slider1" class=" active first">
            <div id="boxx1">
              <h1>ViVace&#8217;s cultuurwereld</h1>
            </div>
            <div id="boxx1b">
              <h2>Brengt mensen bij elkaar</h2>
              <p></p>
              <br>
              <img src="content/arrow.png"> <a href="index.html" title="Cultuurkenner">Cultuurkenner</a> <br>
              <br>
              <img src="content/arrow.png"> <a href="index.html" title="Cultuurvormers">Cultuurvormers</a> <br>
              <br>
              <img src="content/arrow.png"> <a href="index.html" title="Cultuurwereld">Cultuurwereld</a> </div>
          </li>

JavaScript:

function slide(index) {
    if(index !== undefined){
        $.currentTimer = $('ol#timers li.active');
        $.currentWallpaper = $('ol.wallpaper li.active');
        $.currentWelcome = $('#welcome ol.slider li.active');
        $.nextTimer = $('ol#timers li:eq('+index+')');
        $.nextWallpaper = $('ol.wallpaper li:eq('+index+')');
        $.nextWelcome = $('#welcome ol.slider li:eq('+index+')');
        $.nextSlide = $.nextTimer.attr('id');
        $.slideNum = $.nextSlide.replace('timer', '')
        $.slide = $.slideNum;
    }

    $('#welcome').fadeOut($.speed, function() {
        $.currentWelcome.hide().removeClass('active');
        $.nextWelcome.show().addClass('active');
        $('#welcome').fadeIn($.speed);
    });
        $.currentWallpaper.fadeOut($.speed);
        $.nextWallpaper.fadeIn($.speed);
        $.currentWallpaper.removeClass('active');
        $.nextWallpaper.addClass('active');

    $.currentTimer.removeClass('active');
    $.nextTimer.addClass('active');
}

Wanneer ik de code " <div id="boxx1">" eruit haal dan gaat de transitie in IE goed. Maar dan zijn de boxen weer niet goed gestyled.
Ik heb een gevoel dat het komt omdat de div #boxx1 het fade gedeelte van de div #Welcome overschrijft oid.
Ik heb geprobeerd om in de JS file #Welcome te vervangen met #boxx1 maar dat was het ook niet (in de fadeOut function.
Foutmeldingen krijg ik niet in IE of een andere browser.

Mijn excuses als het overkomt als ik niet de Quickstart niet doorgelezen heb maar ik vind het best lastig om het probleem te omschrijven.
Volgens mij heeft aardig wat code met de fades te maken, vandaar dat ik dacht om maar alles online te plaatsen. In het screenshot zijn de code regels waar het om gaat te zien.

Heel fijn dat er op mn post gereageerd wordt. Sorry dat ik het (te) onduidelijk omschrijf.

[ Voor 1% gewijzigd door RobIII op 12-08-2013 09:35 . Reden: Code tags toegevoegd ]

[drm]

NMe, gloeiende gloeiende, ben je nou door je geloof in het goede van de mens vergeten te zeggen dat er ook zoiets bestaat als codetags, of had je gewoon een veel te groot geloof? Deze jongen moet ook wel echt alles zelf bedenken he....

[Zoefff]

Je hebt de code 'ergens' vandaan. Deze code heb je aangepast, nu werkt het niet meer.

Het lijkt me een goed idee om te beginnen met kijken naar de code die je hebt aangepast en aan de hand daarvan te beredeneren wat er mis gaat. Of je legt ons, aan de hand van een voorbeeld, uit wat je hebt aangepast en waarom. Dát is relevante code

[RobIII]

drm schreef op zondag 11 augustus 2013 @ 22:20:
vergeten te zeggen dat er ook zoiets bestaat als code tags

FTFY

[roeni1]

Ik heb de DIV: <div id="boxx1b"> op regel 9 van de HTML pagina toegevoegd om boxen te stylen. Anders heb ik alleen tekst in beeld en ik wil de boxen positioneren e.d.

Dus de originele code is zonder die regel.

[Nedra]

Niet om lastig te doen, maar bij mij doet ie gewoon crossfaden in IE10. Over welke IE hebben we 't eigenlijk?

edit: laat maar, lezen is ook een vak

[ Voor 17% gewijzigd door Nedra op 12-08-2013 19:57 ]