Pseudo classes :after et :before sou IE 7

Bonjour,

IE 7 ne prend pas en compte les pseudo classes :after et :before
Je voudrais juste savoir s'il existe un moyen pour que ce soit possible.
Modifié par TiKi__FloO (20 Jan 2012 - 15:11)

Je ne pensais pas nescessairement à un script tout fait mais à une autre propriété CSS que je ne connaitrais pas, je débute.

Bonjour,
Il semblerait que ce soit impossible en CSS...
Mais ça pourrait apparemment être corrigé grâce à l'importation d'un JS comme dit ici :
http://stackoverflow.com/questions/4181884/after-and-before-css-pseudo-elements-hack-for-ie-7#answers-header

Salut,

un commentaire conditionnel et du javascript sur ce modèle:

jquery.lukelutman.com a écrit :

(function($){

	var patterns = {
		text: /^['"]?(.+?)["']?$/,
		url: /^url\(["']?(.+?)['"]?\)$/
	};

	function clean(content) {
		if(content && content.length) {
			var text = content.match(patterns.text)[1],
				url = text.match(patterns.url);
			return url ? '<img src="' + url[1] + '" />': text;
		}
	}

	function inject(prop, elem, content) {
		if(prop != 'after') prop = 'before';
		if(content = clean(elem.currentStyle[prop])) {
			$(elem)[prop == 'before' ? 'prepend' : 'append'](
				$(document.createElement('span')).addClass(prop).html(content)
			);
		}
	}

	$.pseudo = function(elem) {
		inject('before', elem);
		inject('after', elem);
		elem.runtimeStyle.behavior = null;
	};
	
	if(document.createStyleSheet) {
		var o = document.createStyleSheet(null, 0);
		o.addRule('.dummy','display: static;');
		o.cssText = 'html, head, head *, body, *.before, *.after, *.before *, *.after * { behavior: none; } * { behavior: expression($.pseudo(this)); }';
	}

})(jQuery);

code à insérer dans le< head>
Mais je n'ai aucune idée sur la qualité de ce script, j'étais tombé dessus l'autre jour par hasard.

Merci pour vos réponses ! Je vais tester le script même si je ne le comprend pas vraiment son fonctionnement

A priori, insérer

<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE8.js"></script>
<![endif]-->

devrait suffire, mais je n'ai pas testé, donc je ne garantis rien.

Ca fonctionne à moitié, le navigateur prévoit l'espace pour les "content :" mais n'affiche pas le contenu...

TiKi__FloO a écrit :
Je vais tester le script même si je ne le comprend pas vraiment son fonctionnement

Je suis d'accord, .

Ah , j'avais prévenu que j'en connaissais pas la qualité mais il semble avoir résolu bien des problèmes sur un autre forum, cependant je vous fais confiance.
Modifié par jmlapam (20 Jan 2012 - 19:14)