Partage
  • Partager sur Facebook
  • Partager sur Twitter

Problème W3C

Je ne comprends pas la consigne.

Sujet résolu
    8 octobre 2006 à 14:59:00

    Bonjour à tous !!

    J'ai un petit problème ... :'(
    J'ai été valider ma feuille de style, et là, surprise ...
    Le résultat.
    Mon problème, c'est la classe Opacity ...
    Voici le code de ma feuille de style :
    body
    {
            font-family: verdana;
            font-size: 1px;
            color: #000000;
    }

    a:active, a:visited, a:link {
            text-decoration : none;
            color: #306081;
    }

    a:hover {
            text-decoration : underline;
            color: #52B6FE;
    }

    /* Menus */
    a.menu:link{
    text-decoration:none;
    color: #306081;
    }

    a.menu:visited{
    text-decoration:none;
    color: #306081;}

    a.menu:hover{
    text-decoration:none;
    color: #52B6FE;
    }
    a.menugraph:link{
    text-decoration:none;
    color: #306081;
    }

    a.menugraph:visited{
    text-decoration:none;
    color: #306081;}

    a.menugraph:hover{
    text-decoration:none;
    color: #52B6FE;
    }
    a.menututo:link{
    text-decoration:none;
    color: #306081;
    }

    a.menututo:visited{
    text-decoration:none;
    color: #306081;}

    a.menututo:hover{
    text-decoration:none;
    color: #ffa34f;
    }
    a.menusite:link{
    text-decoration:none;
    color: #306081;
    }

    a.menusite:visited{
    text-decoration:none;
    color: #306081;}

    a.menusite:hover{
    text-decoration:none;
    color: #00cc00;
    }
    a.menupartenaires:link{
    text-decoration:none;
    color: #306081;
    }

    a.menupartenaires:visited{
    text-decoration:none;
    color: #306081;}

    a.menupartenaires:hover{
    text-decoration:none;
    color: #ff33ff;
    }
    /* FORMULAIRES */
    input,select,textarea
    {
            background-image:url('background.gif');
            border:1px solid #A5C3D0;
            font-size:9px;
            font-family:verdana
    }
    /* Opacité des images */
    .opacity{
    filter:alpha(opacity=30);
    -moz-opacity:0.3;
    }


    Voilà, et miantenant, celui ou en HTML ou j'appelle les classe opacity :
    <img border="0" src="Design/w3c.jpg" width="200" height="25" alt="" class="opacity" onMouseover="slowhigh(this)" onMouseout="slowlow(this)">


    Sinon, le script de changement d'opacité :
    <script type="text/javascript">

    /***********************************************
    * Gradual Highlight image script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    ***********************************************/


    var baseopacity=30

    function slowhigh(which2){
    imgobj=which2
    browserdetect=which2.filters? "ie" : typeof which2.style.MozOpacity=="string"? "mozilla" : ""
    instantset(baseopacity)
    highlighting=setInterval("gradualfade(imgobj)",50)
    }

    function slowlow(which2){
    cleartimer()
    instantset(baseopacity)
    }

    function instantset(degree){
    if (browserdetect=="mozilla")
    imgobj.style.MozOpacity=degree/100
    else if (browserdetect=="ie")
    imgobj.filters.alpha.opacity=degree
    }

    function cleartimer(){
    if (window.highlighting) clearInterval(highlighting)
    }

    function gradualfade(cur2){
    if (browserdetect=="mozilla" && cur2.style.MozOpacity<1)
    cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.1, 0.99)
    else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100)
    cur2.filters.alpha.opacity+=10
    else if (window.highlighting)
    clearInterval(highlighting)
    }

    </script>


    Voilà, pouvez vous m'expliquer pourquoi ma feuille ne se valide pas ?
    • Partager sur Facebook
    • Partager sur Twitter
      8 octobre 2006 à 15:55:07

      En fait, c'est du à tes propriétés -moz et filter: qui ne sont pas des propriétés standard de CSS. Donc le validateur te génère une erreur. :euh:

      C'est tout simple... mais après pour le remplacer, je sais pas faire. :D
      • Partager sur Facebook
      • Partager sur Twitter
        8 octobre 2006 à 16:08:14

        Ok, merci de ta réponse, à mon avis, comme c'est à moitié du JS, ça passe pas.
        Si quelqu'un à une autre réponse, merci de me la donner.
        • Partager sur Facebook
        • Partager sur Twitter
          8 octobre 2006 à 17:12:44

          gnomnain a tout à fait raison. Ces propriétés ne sont pas du CSS 2. (pour la -moz c'est du CSS 3, la filter, je suis pas sur, alors je n'oserai pas le dire^^)

          Pour remplacer... éh bien, si c'est sur des liens (ce qui n'a pas l'air d'être le cas^^) il "suffit" soit d'afficher sur un :hover une image avec le filtre voulu. (ce qui oblige à créer une image à chaque fois) Soit de mettre une image alpha. (avec un effet alpha. Par exemple une image blanche avec des "trous" de transparent.)

          Bon courage en tout cas ! (et oui : vivement le CSS 3 :p)
          • Partager sur Facebook
          • Partager sur Twitter
          Anonyme
            8 octobre 2006 à 17:14:39

            Effectivement, la propriété moz... est une propriété expérimentale pour les navigateurs gecko (je crois) donc ca ne marche pas.
            Au passage, l'url que tu as dpnnée était éronnée, voici la bonne :
            http://jigsaw.w3.org/css-validator/validator?uri=http://link399.free.fr/Hardgraph/Design/style.css
            • Partager sur Facebook
            • Partager sur Twitter
              8 octobre 2006 à 18:07:35

              -moz > mozilla ^^
              filter > ie
              Quand les navigateurs inventent leur balises ^^
              • Partager sur Facebook
              • Partager sur Twitter
                8 octobre 2006 à 19:41:16

                Merci pour vos réponses. Mais, ça m'embête, je voulais faire un site de design, mais avec les normes quoi et là, ça casse ...
                Si quelqu'un peut m'aider ...
                • Partager sur Facebook
                • Partager sur Twitter

                Problème W3C

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
                • Editeur
                • Markdown