Comment optimiser les performances des expressions CSS

Méthodes pour optimiser les performances de l'expression CSS : 1. Exécutez l'expression CSS une seule fois dans l'élément correspondant ; 2. Dans le corps de l'instruction CSS Expression, réinitialisez la propriété CSS qui déclenche l'expression.

L'environnement d'exploitation de cet article : système Windows 7, HTML5&&CSS3, ordinateur Dell G3.

Comment optimiser les performances des expressions CSS ?

Le plus gros problème avec la fonctionnalité d'expression CSS dans le navigateur IE : elle est exécutée à plusieurs reprises, peut-être des centaines ou des milliers de fois par seconde, provoquant de sérieux problèmes de performances. Par exemple,

Comment optimiser l'expression CSS ?

Au minimum : si nous exécutons l'expression CSS une seule fois sur l'élément correspondant, les performances s'amélioreront considérablement.

old9 propose une solution dans l'article "CSS Expression Reloaded" :

Dans le corps de l'instruction CSS Expression, la réinitialisation de la propriété CSS de l'Expression sera déclenchée.

Recommandé : "Tutoriel vidéo CSS"

Par exemple :

div {
    zoom: expression(function(el){el.style.zoom = "1"; alert(el.tagName);}(this));
}

Quelques points supplémentaires :

L'expression CSS est exécutée dans n'importe quel élément correspondant.

Dans une expression CSS, le mot-clé "this" pointe vers l'élément HTML actuellement correspondant.

Les propriétés CSS utilisent certaines propriétés inhabituelles pour se déclencher et sont réinitialisées aux valeurs par défaut après le déclenchement.

Il existe une solution similaire :

div {
    -singlex: expression(this.singlex ? 0 : (function(t) { 
    alert(t.tagName); t.singlex = 0; 
    } )(this));
}

Mais ce code ne résout pas complètement le plus gros problème de performances de CSS Expression. Parce que le script Expression doit toujours être exécuté à chaque fois qu'il est déclenché, par exemple lorsque vous faites défiler la molette centrale de la souris.

Enfin, il est souligné que l'expression CSS est uniquement optimisée, mais cela ne signifie pas que l'expression CSS n'a pas d'autres problèmes.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!