Javascript ne se charge pas dans IE7

Question

J'ai du mal à faire en sorte que JQuery se charge dans IE7, cela fonctionne bien dans tous les autres navigateurs, firefox, safari, opera, ie8 mais pas dans IE7.

Si quelqu'un a une idée de la raison, faites-le moi savoir.

Merci beaucoup,

Q

Et ce, avant que le

<script  src="js/jquery.js" type="text/javascript"></script>
<script  src="js/plugins.js" type="text/javascript"></script>

<script type="text/javascript">
$(function(){
$('#coda-slider-1').codaSlider();
    $('#coda-services-1').codaSlider();
        $('#coda-work-1').codaSlider();

$("a[rel=rab]").fancybox({
                'transitionIn'  : 'fade',
                'transitionOut' : 'fade',
                        'titlePosition'     : 'over',
            });
$("a[rel=annsummers]").fancybox({
                'transitionIn'  : 'fade',
                'transitionOut' : 'fade',
                        'titlePosition'     : 'over',
            });
$("a[rel=sportingbet]").fancybox({
        'transitionIn'      : 'fade',
        'transitionOut'     : 'fade',
                'titlePosition'     : 'over',
    });
$("a[rel=ryman]").fancybox({
        'transitionIn'      : 'fade',
        'transitionOut'     : 'fade',
        'titlePosition'     : 'over',
    });
$('a').click(function() {
   var elementClicked = $(this).attr("href");
   var destination = $(elementClicked).offset().top;
   $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination-20}, 1000 );
   return false;
    });
});

 function formatText(index, panel) {
          return index + "";
        }    
        $(function () {
            $('.slider').slider({
                easing: "easeInOutQuart", 
                autoPlay: true, 
                delay: 3300,   
                startStopped: false, 
                animationTime: 900, 
                hashTags: false, 
                buildNavigation: true,
                pauseOnHover: true,  
                navigationFormatter: formatText   
            });
        $("#slide-jump").click(function(){
                $('.slider').slider(6);
            });    
        });
 function formatText(index, panel) {
          return index + "";
        }    
        $(function () {
            $('.history-slider').slider({
                easing: "easeInOutQuart", 
                autoPlay: false,    
                delay: 3000,    
                startStopped: false,        
                animationTime: 900,         
                hashTags: false,       
                buildNavigation: false,   
                pauseOnHover: true,      
                navigationFormatter: formatText       
            });
        $("#slide-jump").click(function(){
                $('.history-slider').slider(6);
            });    
        });

</script>

Answer 1

Le problème, ce sont les virgules de fin de ligne ; IE ne les aime pas. En voici un, par exemple :

$("a[rel=rab]").fancybox({
    'transitionIn'  : 'fade',
    'transitionOut' : 'fade',
    'titlePosition' : 'over',  // <= the trailing comma
});

Il ne les aime pas non plus dans les initialisations de tableaux.

Answer 2

Vous pourriez vous épargner un grand nombre de saisies en déclarant ce bloc de paramètres une seule fois :

var fancyboxSetup = {
  'transitionIn'  : 'fade',
  'transitionOut' : 'fade',
  'titlePosition'     : 'over'
};

alors utilisez-le simplement par son nom :

$("a[rel=rab]").fancybox(fancyboxSetup);

Vous pourrez également constater que vous pouvez installer tous vos ancrages en un seul appel :

$('a[rel]').fancybox(fancyboxSetup);

Answer 3

Je pense que c'est à cause des virgules supplémentaires dans la liste des propriétés.

$("a[rel=sportingbet]").fancybox({
        'transitionIn'      : 'fade',
        'transitionOut'     : 'fade',
                'titlePosition'     : 'over', <---------
    });

Vous pouvez également combiner tous les éléments en un seul sélecteur afin de réduire la taille du fichier. Je ne sais pas si vous avez besoin de cette flexibilité pour les transitions.

$("a[rel=annsummers], a[rel=sportingbet], a[rel=sportingbet], a[rel=ryman]").fancybox({
        'transitionIn'      : 'fade',
        'transitionOut'     : 'fade',
                'titlePosition'     : 'over'
    });