Jquery Innerfade in IE6 t/m 8 werkt niet - Softwareontwikkeling

zondag 29 januari 2012 20:34

Acties:

Verwijderd

Topicstarter

Ha mede webdesigners,

Ik ben bezig met het maken van een website maar ben momenteel vastgelopen. Innerfade werkt niet goed in Internet Explorer 6 t/m 8. De images en text worden onder elkaar weergeven.

In IE9, Chrome en Firefox werkt de Innerfade normaal

Hier de code en pagina:

*snip* spam (Ook in IE9 compatibiliteits weergave vertoond het probleem)

Header:

code:

            <script type="text/javascript" src="js/lib/jquery/jquery.min.js"></script>
            <script type="text/javascript" src="js/lib/jquery/jquery.corner.js"></script>
            <script type="text/javascript" src="js/lib/jquery/jquery.innerfade.js"></script>
            <script type="text/javascript" src="js/ie/iepngfix_tilebg.js"></script>
            
            <style type="text/css">
            img, div { behavior: url(ie/pngfix/iepngfix.htc) }
            </style>
            
            <script type="text/javascript">
            $(document).ready(function() {      
            $('.quicklogin').corner();
            $('.round').corner();
            $('.credits').corner("bottom");
            $('.text').corner("top");       
            });
            </script>   
            
            <script type="text/javascript">
           $(document).ready(
                    function(){
                        $('#news').innerfade({
                            animationtype: 'fade',
                            speed: 750,
                            timeout: 2000,
                            type: 'sequence',
                            containerheight: 'auto'
                        });
                        
                        $('ul#illustraties').innerfade({
                            animationtype: 'slide',
                            speed: 1000,
                            timeout: 5000,
                            type: 'sequence',
                            containerheight: 'auto'
                        });

                });
            </script>

CSS:

code:

#news
    {
        width:600px;
        position:absolute;
        top:108px;
        text-align:justify;
        line-height:16px;
        color:#6b7178;
        float:left;
    }

Body:

code:

    <body>
            
        <div id="headercontainer">      
        
            <div id="header">
            
            <ul id="news">
                <li>
                    <strong>24/01/12 |</strong> KPN jaarcijfers 2011
                </li>
                <li>
                    <strong>25/01/12 |</strong> IFO-index ondernemersvertrouwen januari // verwachting: 107,6 uitkomst: 108,3
                </li>
                <li>
                    <strong>27/01/12 |</strong> Economische groei (GDP) 4e kwartaal 2011 // verwachting +3,2% uitkomst: +2,8%
                </li>
            </ul>   

                <div id="logo">                         
                    <a href="http://www.cfdaytrader.nl/"><img src="images/logo.png" alt="Homepage" title="Homepage"/></a>                               
                </div>
                
                <div id="quicklogin" class="quicklogin">        
                <strong><span id="orange">Abonnee login</span></strong><br/><br/>
                <table width="100%" cellpadding="0" cellspacing="0" border="0">
                <tr class="trbreak"><td align="left" valign="top">Gebruikersnaam</td><td align="left"><input name="loginNaam" type="text" maxlength="15" style="padding:0px; float:right; border:1px solid #CCCCCC; width:170px; height:12px; font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10px;" value=""/></td></tr>
                <tr><td align="left" valign="top">Wachtwoord</td><td align="left"><input name="loginPass" type="password" style="padding:0px; float:right; border:1px solid #CCCCCC; width:170px; height:12px; font-family:Verdana, Arial, Helvetica, sans-serif;font-size:10px;" value=""/></td></tr>
                </table><br/>
                <input type="submit" name="loginSubmit" value="Login" style="width:50px; color:#000; font-family:Verdana, Arial, Helvetica, sans-serif;font-size:11px;"/>
                <input type="submit" name="loginSubmit" value="Wachtwoord vergeten" style="width:150px; color:#000; font-family:Verdana, Arial, Helvetica, sans-serif;font-size:11px;"/>
                </div>
                    
            </div> <!-- einde headercontainer -->               
        </div> <!-- einde header -->
        
            <div id="navigatie" class="navigatie">  
                <ul id="menu">
                    <li><a href="http://www.cfdaytrader.nl/layout/" target="_self" class="active">Home</a></li>
                    <li><a href="/layout/trading-strategie" target="_self">Trading strategie</a></li>
                    <li><a href="/layout/contract-for-difference" target="_self">Contract for Difference</a></li>
                    <li><a href="#" target="_self">Trading resultaten</a></li>
                    <li><a href="/layout/av" target="_self">Algemene voorwaarden</a></li>
                    <li><a href="/layout/registreren" target="_self">Registreren</a></li>
                    <li><a href="/layout/contact" target="_self">Contact</a></li>
                </ul>
            </div> <!-- einde menu -->
                    
                <div id="contentcontainer">             
                    <div id="content">  
                    
                        <div id="homeleft" class="home round">
                            <ul id="illustraties"> 
                                <li>
                                    <img src="images/overcfdaytrader.png" class="round" alt="Contract for Difference trading"/>
                                </li>
                                <li>
                                    <a href="/layout/registreren"><img src="images/abonnementen.png" class="round" alt="Abonnementen"/></a>                             
                                </li> 
                            </ul>   
                        </div> <!-- einde innerfade -->

Hopelijk ziet iemand wat ik over het hoofd zie. Op de website van de ontwikkelaar van Innerfade werd er ook geen verdere code gebruikt en het werkt gewoon in IE6 t/m 8.

Alvast bedankt!!!!

[ Voor 0% gewijzigd door RobIII op 29-01-2012 21:31 ]

zondag 29 januari 2012 21:35

Acties:

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Hoi en welkom op GoT

Ik verwijs je graag even naar onze Quickstart waarin je zult lezen dat we iets meer verwachten van een topicstart dan je hier post zoals wat je zelf al geprobeerd/gezocht/gevonden hebt om uit 't probleem te komen (en in de Devschuur in 't bijzonder dus bijvoorbeeld welke stappen je hebt genomen om 't probleem te debuggen (Debuggen: Hoe doe ik dat?)).

Ook zien we, als je code post, graag enkel relevante code om je probleem te reproduceren. De code die je nu post bevat grotendeels overbodige zaken en kan veel compacter en toch tevens je probleem illustreren. Ook verwijzen naar een online testcase is geen probleem, maar ook daar zien we dan graag een uitgeklede testcase en geen complete site (al dan niet in wording) met alles erop en eraan; buiten het feit dat dit onder (allicht onbedoelde, maar toch) spam valt is het ook niet overzichtelijk voor mensen die je proberen te helpen: die zullen eerst door de bomen 't bos moeten zoeken en vervolgens in dat bos een naald gaan zoeken

Je kunt 't voor iedereen, en daarmee meteen voor jezelf, makkelijker maken door even een testcase op te zetten. 10 tegen 1 dat je dan je eigen probleem al oplost voordat je überhaupt een topic moet openen

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

Dit topic is gesloten.