rss
validation xhtml strict
par web
 Fil de Discussions
Statut : Non résolu
jeudi 8 juin 2006 à 17:38:11
Bonjour,

Depuis quelques temps, j'essaye de valider une page en xhtml strict, mais en vain à cause d'une balise form et d'un onKeyUp="checkTempo()". Pourriez vous m'aider?

Voici le code. (Et si par la même occasion, vous aviez une idée pour le center, c'est pas très joli dans le code de faire une table pour ça ;))

* Dans le body

<form name="settings">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr>
<td>
<p class="left">
<input type="radio" name="order" value="normal" /> Ordre normal   
<input type="radio" name="order" value="aléatoire" /> Ordre aléatoire
</p>
</td>
</tr>
<tr>
<td>
<p class="left">
<input type="checkbox" name="repeat" /> Répétition
</p>
</td>
</tr>
<tr>
<td>
<p class="left">Temporisation :
<input type="text" name="tempo" value="3" size="4" maxlength="2" style="background:#FFFFFF;color:#000033;font-size:14;font-family:Courier,monospace;te­xt-align:center;" onKeyUp="checkTempo()" onChange="checkTempo()" />seconde(s)
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr>
<td align="center">
<input type="button" onClick="launchFirst()" name="bLaunch" value="Lancer" style="width: 150px" />     
<input type="button" onClick="stop()" name="bStop" value="Stopper" style="width: 150px" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>

* Javascript externe

var rep = ""; // Répertoire des images du diaporama (vide si meme repertoire que le fichier html)
var num = 0;
var myCounter;
var next_img = new Image;
next_img.src = rep+"pixel_transparent.gif";
var wPopup;
var tabImg;
var tabImgSave = new Array;
tabImgSave[0] = 'img0.jpg';
tabImgSave[1] = 'img1.jpg';
tabImgSave[2] = 'img2.jpg';
tabImgSave[3] = 'img3.jpg';
tabImgSave[4] = 'img4.jpg';
tabImgSave[5] = 'img5.jpg';
tabImgSave[6] = 'img6.jpg';
tabImgSave[7] = 'img7.jpg';
tabImgSave[8] = 'img8.jpg';
tabImgSave[9] = 'img9.jpg';
tabImgSave[10] = 'img10.jpg';
tabImgSave[11] = 'img11.jpg';
tabImgSave[12] = 'img12.jpg';
tabImgSave[13] = 'img13.jpg';
tabImgSave[14] = 'img14.jpg';
var nb_img = tabImgSave.length;


//
// Les trois fonctions suivantes (+ éventuellement, "mySplice")
// servent à mélanger un tableau quelconque à partir d'une
// permutation tirée aléatoirement
//

// Méthode "splice" si elle n'existe pas
// tab : tableau
// s : début de la suppression
// l : nombre d'éléments à supprimer
function mySplice(s, l)
{
if(s+l > this.length) l = this.length-s;

for(var i=s; i<this.length; ++i)
this[i] = this[i+1];

delete this[this.length-1];
this.length--;
}

// Est-ce que la méthode "splice" est disponible ?
if(!Array.prototype.splice)
{
// Non, alors on utilise la version "maison"
Array.prototype.splice = mySplice;
}

// Génère une fonctione sous-excédente
function fctSsExc()
{
var fct = new Array;
for(var i=0; i<nb_img; i++)
{
fct[i] = Math.floor( Math.random()*(nb_img-i) );
}
return fct;
}

// Construit une permutation à partir d'une fonction sous-excédente
function buildSigma()
{
var fct_ss_exc = fctSsExc();
var set_N = new Array;

for(var i=0; i<nb_img; i++)
{
set_N[i] = i;
}

var sigma = new Array;

for(var i=0; i<nb_img; i++)
{
sigma[i] = set_N[fct_ss_exc[i]];
set_N.splice(fct_ss_exc[i],1);
}
return sigma;
}

// Retourne une version mélangée du tableau passé en paramètre
function shuffleArray(myArray) {
var sigma = buildSigma();
var newArray = new Array;

for(var i=0; i<nb_img; i++) {
newArray[i] = myArray[sigma[i]];
}
return newArray;
}
//
// Fin des fonctions de mélange
//

// Donne le focus au bouton "Lancer"
function focusOnLaunch() {
window.document.forms.settings.bLaunch.focus();
}

// Donne le focus au bouton "Stopper"
function focusOnStop() {
window.document.forms.settings.bStop.focus();
}
function next() {
// Est-ce que l'image suivante est oréchargée ?
if(next_img.complete) {
// Oui, alors après le temps de pause choisi par l'utilisateur, cette image remplacera l'actuelle
myCounter = setTimeout("launch()", 1000*window.document.settings.tempo.value);
}
else {
// Non, alors on continue d'attendre qu'elle le soit
myCounter = setTimeout("next()", 250);
}
}

// Lance le slideshow
function launchFirst() {
// Petite vérification de la temporisation choisie
if(window.document.settings.tempo.value == "") {
alert("Précisez une temporisation entre 0 et 60 secondes...");
return false;
}

// Ordre normal ou aléatoire
if(window.document.settings.order[1].checked) {
tabImg = shuffleArray(tabImgSave);
}
else {
tabImg = tabImgSave;
}

// Avant de lancer le slideshow, on désactive tous les éléments du formulaire
// et on active le bouton "Stopper"
next_img.src = rep+tabImg[0];
window.document.forms.settings.bStop.disabled = false;
focusOnStop();
window.document.forms.settings.bLaunch.disabled = true;
window.document.forms.settings.repeat.disabled = true;
window.document.forms.settings.order[0].disabled = true;
window.document.forms.settings.order[1].disabled = true;
window.document.forms.settings.tempo.disabled = true;

launch();
}

// Poursuit le slideshow
function launch() {
// Si la fenêtre n'existe pas ou est fermée, on la réouvre
if(!wPopup || wPopup.closed) {
wPopup = window.open('', 'img_popup', 'width=50, height=50, top='+(screen.height-50)/2+', left='+(screen.width-50)/2+', status=no, directories=no, toolbar=no, location=no, menubar=no, scrollbars=no, resizable=yes');
}

// On écrit le contenu de la fenêtre popup
wPopup.document.clear();
wPopup.document.write("<html><head><title>Diaporama : "+(num+1)+"/"+nb_img+"</title></head>");

// La fonction qui attend que l'image soit chargée et affichée pour redimensionner la fenêtre à la bonne taille
wPopup.document.write('<script language="JavaScript">\nfunction checkSize() { if(document.images && document.images[0].complete) { w = document.images[0].width+50; h = document.images[0].height+100; window.resizeTo(w, h); window.moveTo((screen.width-w)/2, (screen.height-h)/2); document.images[0].style.visibility = "visible"; window.focus(); if(opener.next_img.src != opener.rep+opener.tabImg[opener.num]) { opener.next_img.src = opener.rep+opener.tabImg[opener.num]; } } else { setTimeout("checkSize()", 250); } }\n</'+'SCRIPT>');

wPopup.document.write('<body bgcolor="#FFFFFF" leftMargin="0" topMargin="0" marginWidth="0" marginHeight="0">');
wPopup.document.write('<table width="100%" height="100%" align="center" cellpadding="0" cellspacing="0"><tr valign="middle"><td align="center"><img src="'+next_img.src+'" border="0" onLoad="checkSize()" onClick="window.opener.stop()" style="visibility:hidden"></td></tr></table>');
wPopup.document.write('</body></html>');
wPopup.document.close();
num++;

// On a passé toutes les images, on repart du début
if(num == nb_img) num = 0;

// Si "Répéter" n'est pas cochée, on stoppe le slideshow
if(num == 0 && !window.document.settings.repeat.checked) {
setTimeout("stop()", 1000*window.document.settings.tempo.value);
return false;
}

// En cas de répétition en mode aléatoire, on remélange les images
if(num == 0 && window.document.settings.order[1].checked) {
tabImg = shuffleArray(tabImgSave);
}

next();
}

// Stoppe le slideshow
function stop() {
clearTimeout(myCounter);
wPopup.close();
// On réactive tous les éléments du formulaire
// et on désactive le bouton "Stopper"
window.document.forms.settings.bLaunch.disabled = false;
focusOnLaunch();
window.document.forms.settings.bStop.disabled = true;
window.document.forms.settings.repeat.disabled = false;
window.document.forms.settings.order[0].disabled = false;
window.document.forms.settings.order[1].disabled = false;
window.document.forms.settings.tempo.disabled = false;
num = 0;
}

// Vérification de la temporisation à chaque modification de celle-ci
function checkTempo() {
var t = window.document.settings.tempo.value;
if(isNaN(t) || t<0 || t>60) {
window.document.settings.tempo.value = 3;
alert("Mauvaise temporisation...\nEntrez un temps compris entre 0 et 60 secondes.");
return false;
}
}

Merci d'avance!!!
Répondre à web  Signaler ce message aux modérateurs Aller au dernier message

1


  • 1
    Ce message vous semble utile, votez !
  • Ce message ne vous semble pas utile, votez !
  • Signaler ce message aux modérateurs
Par Yvan, le jeudi 8 juin 2006 à 19:47:35 Fil de Discussions
En Xhtml, les attributs et balises doivent être en minuscules.
Répondre à Yvan

2


  • 1
    Ce message vous semble utile, votez !
  • Ce message ne vous semble pas utile, votez !
  • Signaler ce message aux modérateurs
Par benj, le dimanche 8 juillet 2007 à 18:14:20 Fil de Discussions
de plus il n'y a pas d'attribut "name" dans une balise "form" en xhtml strict,
Je sais, c'est embêtant, mais c'est comme ça !

Bon courage.
Benj
Répondre à benj

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Par Gihef, le dimanche 8 juillet 2007 à 19:27:35 Fil de Discussions 
Bonjour,

Je te propose d'essayer ça :
<?xml version="1.0" encoding="ISO-8859-15"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

<head>
<title>XHTML Strict valide</title>
    <meta http-equiv="Content-type" content="text/html; charset=iso-8859-15" />
    <meta http-equiv="Content-Script-Type" content="text/javascript" />
    <script type="text/javascript" src="js.js"></script>

    <style type="text/css">
    html, body {
        margin: 0;
        padding: 0;
        text-align: center;
        font-size : 100%;
        }
    #conteneur {
        position: relative;
        margin: 0 auto;
        width: 760px;
        text-align: left;
        border : 1px dotted #f66;
        }
    form#settings {
        border : 1px dotted #666;
        width : 400px;
        margin: 0 auto;
        }
    input#tempo {
        background : #fff;
        color : #003;
        font-size : 14;
        font-family : Courier, monospace;
        text-align : center;
        }
    .left {
        margin-left : 65px;
        }
    #center {
        text-align : center;
        }
    #center #span1 {
        padding-right : 20px;
        }
    #center #span2 {
        padding-left : 20px;
        }
    </style>
</head>

<body>
  <div id="conteneur">

    <form id="settings" action="">
      <p class="left">
       <input type="radio" name="order" value="normal" /> Ordre normal&nbsp;&nbsp;&nbsp;
       <input type="radio" name="order" value="aléatoire" /> Ordre aléatoire
      </p>
      <p class="left">
       <input type="checkbox" name="repeat" /> Répétition
      </p>
      <p class="left">Temporisation :
       <input type="text" name="tempo" id="tempo" value="3" size="4" maxlength="2" onkeyup="checkTempo()" onchange="checkTempo()" /> seconde(s)
      </p>
      <p id="center">
        <span id="span1">
          <input type="button" onclick="launchFirst()" name="bLaunch" value="Lancer" style="width: 150px" />
        </span>
        <span id="span2">
          <input type="button" onclick="stop()" name="bStop" value="Stopper" style="width: 150px" />
        </span>
      </p>
    </form>

  </div>
</body>
</html>
Que le validateur du W3C accepte.
 
Répondre à Gihef
Discussions pertinentes trouvées dans le forum
09/02 02h30<div name ou <div id en xhtml strict ?Webmastering15/02 03h255
18/08 00h20Problème validation XHTMLWebmastering18/08 01h123
28/09 17h27probleme de validation XhtmlWebmastering03/10 15h106
07/01 01h15PHP / CSS / Validateur HTML / XHTML...Webmastering15/01 10h2540
Plus de discussions sur « validation xhtml strict » Discussion en cours Discussion fermée Problème résolu
Logiciels pertinents trouvés dans les téléchargements
Télécharger Firstpage 2006Firstpage - First Page 2006 est un éditeur html gratuit et excellent. Il permet de travailler un code HTML en couleur, ainsi que de...Catégorie: Editeurs HTML
Licence: Freeware/gratuit
Télécharger PSPad 4.5.2PSPad - PSPad est un excellent éditeur de texte. Il est utile pour travailler sur du simple texte, mais aussi sur du HTML, CSS,...Catégorie: Développement
Licence: Freeware/gratuit
Télécharger Comodo Firewall Pro 3.0.25.378Comodo Firewall Pro - Comodo Firewall pro est un pare-feu personnel gratuit proposant la plupart des fonctionnalités proposées par les firewalls...Catégorie: Firewall
Licence: Freeware/gratuit
Télécharger Web Developer Toolbar 1.1.6Web Developer Toolbar - WebDeveloper est une extension firefox représentant une formidable boîte à outils pour examiner et manipuler les pages...Catégorie: Extensions Firefox
Licence: Freeware/gratuit
Plus de logiciels gratuits sur « validation xhtml strict »
Répondre
Titre du message :
Votre pseudo:
Votre email :
Message: 
  •  
  •  
Options: Recevoir les réponses par mail.
 

Aide