Validation W3C

Bonjour,

Quelqu'un peut-il m'aider à corriger les deux dernières erreurs pour que mon site web soit totalement validé par W3C ?

J'ai inséré un slideshow JQuery (Pixedelic) mais dans le corps du fichier HTML, W3C n'accepte pas les éléments data-thumb et data-easing: voir ici.

Est-il possible de les mettre dans du CSS.
Je tiens à préciser que je suis novice en la matière.

Si cela peut aider, je retrouve data-thumb et data-easing dans le script du fichier Javascript:

.....

elem.after('<div id="pix_pag" />');	//I create a div that will contain the play/stop button and the pagination buttons
		if(pagination==true) {
			$('#pix_pag').append('<ul id="pix_pag_ul" />');
			var li;
			for (li = 0; li < amountSlide; li++){
				$('#pix_pag_ul').append('<li id="pag_nav_'+li+'" style="position:relative; z-index:1002"><span><span>'+li+'</span></span></li>');
				if(opts.thumbs==true) {
					var dataThumb = selector.eq(li).attr('data-thumb');
					var newImg = new Image();
					newImg.src = dataThumb;
					$('li#pag_nav_'+li).append($(newImg).attr('class','pix_thumb').css('position','absolute').animate({opacity:0},0));
					$('li#pag_nav_'+li+' > img').after('<div class="thumb_arrow" />');
					$('li#pag_nav_'+li+' > .thumb_arrow').animate({opacity:0},0);
					

......




.......

if (lMoveIn!=0){
							$('.diapocurrent .fromLeft, .diapocurrent .fromRight, .diapocurrent .fromTop, .diapocurrent .fromBottom, .diapocurrent .fadeIn').each(function(){
								if($(this).attr('data-ing')!=''){
									var easeMove = $(this).attr('data-easing');
								} else {
									var easeMove = easing;
								}
								var t = $(this);
								var wMoveIn = t.width();
								var hMoveIn = t.outerHeight();
								t.css('width',wMoveIn);
								var pos = t.position();

......

Merci d'avance.
Modifié par grosbenji (12 Oct 2011 - 03:09)

Salut,

1ère remarque:
Dans le lien que tu indiques, il y a 65 erreurs en transitional, c'est vraiment beaucoup.
Et où sont les références dont tu parles (data)?

2ème remarque:
Il faudrait que l'on puisse voir ton HTML qui pose problème.

3ème remarque:
Pour le CSS, cela dépend de ton script voir ce lien
Modifié par jmlapam (12 Oct 2011 - 08:15)

Le lien que j'ai mis n'est pas ma page web c'est juste une capture d'écran pour montrer ce que m'a trouvé W3C comme erreur: voir içi

Voici le HTML qui pose prolème:

<div class="pix_diapo">

						<div data-thumb="images/thumbs/slide1.png">
							<img src="images/slides/slide1.jpg" alt="slide1"/>
							<div class="caption elemHover fromLeft">
								Vente de Tableaux
							</div>
						</div>
						
						<div data-thumb="images/thumbs/slide2.png">
							<img src="images/slides/slide2.jpg" alt="slide2"/> 
							<div class="caption elemHover fromRight" style="bottom:65px; padding-bottom:5px; color:#ff0; text-transform:uppercase">
								Vente de Pochoirs Personalisés
							</div>
							<div class="caption elemHover fromLeft" style="padding-top:5px;">
								Peinture sur toile
							</div>
						</div>
						
						<div data-thumb="images/thumbs/slide3.png">
							<img src="images/slides/slide3.jpg" alt="slide3"/>
							<div class="elemHover caption fromLeft" style="bottom:70px; width:auto; -webkit-border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; -moz-border-radius-topright: 6px; -moz-border-radius-bottomright: 6px; border-top-right-radius: 6px; border-bottom-right-radius: 6px;">
								test
							</div>
							<div class="elemHover button fromTop" data-easing="easeOutExpo" style="left:388px; bottom:78px;">
								test 2
							</div>
							<div class="elemHover button button2 fromBottom" data-easing="easeOutExpo" style="left:512px; bottom:78px;">
								test 3
							</div>
						</div>
						
						
							
						<div data-thumb="images/thumbs/slide4.png">
							<img src="images/slides/slide4.jpg" alt="slide4"/>
							<div class="caption elemHover fromBottom">
								Vente de tableau personnalisé
							</div>
						</div>
				
						
						
						<div data-thumb="images/thumbs/slide5.png">
							<img src="images/slides/slide5.jpg" alt="slide5"/>
						</div>
						
					</div><!-- #pix_diapo -->

Salut,

Pour utiliser les attributs data-*, il vaut mieux adopter le doctype HTML 5 pour être syntaxiquement valide.

Merci beaucoup, c'est valide en HTML5.

Par contre j'ai dû supprimer la ligne suivante:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

car il me trouvait cette erreur:
Line 6, Column 76: Bad value Content-Type for attribute http-equiv on XHTML element meta.

La page est validé mais il y a 3 warnings: voir ici.

Est-ce sans importance?

Dernière question, est-ce que mon index peut être en HTML5 et le reste de mes page en XHTML, car si je met les autres pages en HTML5 j'obtiens beaucoup de nouvelles erreurs!!

Merci beaucoup en tout cas pour cette réponse rapide.
Modifié par grosbenji (12 Oct 2011 - 10:17)

Pour déclarer le codage employé de façon valide en HTML 5, il faut employer la syntaxe suivante :

<meta charset="iso-8859-1">

Dernière question, est-ce grâve si ma page index est en HTML5 et le reste de mes page en XHTML, car si je met les autres pages en HTML5 j'obtiens de nouvelles erreurs!!

grosbenji a écrit :
Dernière question, est-ce grâve si ma page index est en HTML5 et le reste de mes page en XHTML, car si je met les autres pages en HTML5 j'obtiens de nouvelles erreurs!!

Non.