Ombre portée texte, encadré, coins arrondis et dégradés avec le plugin officiel jQuery

Existe-t-il un plugin jQuery officiel (comme l'interface utilisateur jQuery) qui autorise ces effets dans tous les navigateurs? Ou au moins IE8, Chome, FF et Opera. Je ne veux pas de plugins utilisateur car ceux-ci manquent souvent de support à long terme, sont incompatibles entre eux ou manquent de qualité et d'optimisation cohérentes.Ombre portée texte, encadré, coins arrondis et dégradés avec le plugin officiel jQuery

J'ai vu des "classes de superposition et de clichés instantanés" dans la page de démonstration de l'interface jQuery, mais je n'y trouve aucune documentation. Je pense que ces fonctionnalités si souvent souhaitées doivent être incluses dans jQuery en quelque sorte?

J'apprécierai n'importe quelle aide! Merci d'avance!

Source

2010-10-02 Boris Hamanov

bien que j'en doute vraiment, car IE8 ne supporte pas les ombres CSS3 ... –

Eh bien, c'est le point, IE8 ne supporte pas les ombres. Ni aucun des autres effets que je mentionne. Mais ils peuvent être émulés de différentes manières. Y compris jQuery. –

Il n'y a pas de façon "officielle" de le faire, mais il y a un moyen pragmatique (qui n'a rien à voir avec jQuery). Pour certains sites, j'ai traité le problème entièrement dans le CSS, en utilisant une combinaison des règles "authentiques", les versions spécifiques au navigateur, puis le fichier htc CSS3 PIE (pour IE). Un exemple:

div.roundbox { 
    border-radius: 8px;   // Official. Maybe someday. 
    -webkit-border-radius: 8px; // Webkit browsers 
    -moz-border-radius: 8px;  // Firefox 
    behavior: url(PIE.htc);  // IE 
}

PIE CSS3 fonctionne remarquablement bien, et semble faire beaucoup mieux que la famille IE7.js des solutions. Fondamentalement, vous laissez tomber cette même ligne behavior dans toutes les règles CSS qui utilisent border-radius, box-shadow, etc. Le script s'occupe du reste, et n'a aucun effet sur les navigateurs non IE qui rendront les effets via l'un des trois premières directives.

Vous pouvez également établir une liste de tous vos objets PIE digne et déclariez le comportement d'un seul coup (après les règles régulières):

div.shadowbox, div.roundbox, p.somethingelse { behavior: url(PIE.htc); }

Il y a certainement beaucoup de place pour le débat sur la sagesse cette approche - mais cela fonctionne très bien dans de nombreux cas.

Source

2010-10-02 23:05:00

ouah! +1 merci de partager ça! –

PIE.htc est essentiellement une autre bibliothèque javascript externe et en phase bêta sur ce sujet. Mon site est très complexe et non standard, et c'est exactement le genre de solution que je veux éviter. Je n'utilise même pas les extensions -webkit et -moz car elles ont parfois d'étranges inconséquences. Mais merci de partager ça de toute façon ça a l'air bien! –

En effet, beaucoup de place pour le débat. Si vous utilisez jQuery, vous utilisez déjà une bibliothèque tierce pour vous aider à corriger les différences entre les navigateurs. Des choses comme les coins arrondis et l'ombre de boîte vous placent déjà dans le domaine de l'incohérence étrange du navigateur au navigateur. Il n'y a pas de solution magique pour les navigateurs qui sont antérieurs à l'émergence populaire de ces effets. Que vous considériez pie.htc ou une autre approche, spackle est spackle. Si cela fonctionne bien - et cela est vrai, même sur les grandes applications avec des interfaces utilisateur complexes - alors c'est aussi digne de considération que n'importe quelle autre option. Le parfait peut être l'ennemi du bien. –

Ombre portée texte, encadré, coins arrondis et dégradés avec le plugin officiel jQuery

Répondre

Questions connexes