Rendre un background cliquable...

Résolu
Bonjour,

je ne trouve pas l'astuce pour rendre un background cliquable...
Pour exemple, je souhaiterais arriver à ça image des produits top a c h a c'est des images en background mais cliquable
PLSS HELP
Merci pour votre attention
__________________________________
<div 'style='text-align: left; height: 215px; background: url(images/imagespro/$image)

no-repeat scroll center top transparent; padding: 0px;'>

4 réponses

  1. merci a vous tous mais jais trouver une solution a mon problem.

    ______________________________________________________

    css

    #zone1 { /* la zone de lien */
    float: left;
    width : 100%;
    height: 100%;
    margin-left: 0px;
    margin-top: 0px;
    }
    ___________________________________
    code de la page en php

    <div style='text-align: left; height: 215px; width:auto; background: url(images/imagespro/$image)

    no-repeat scroll center top transparent; padding: 0px;'><a id='zone1' href='index.php?pg=article&id_s_f=".$res['id_s_f']."&id=".$res['id']."' title='click'> <img src='promo/$promo'></div></a>
    1. Un background sert uniquement à la décoration : c'est un non sens de le rendre cliquable, contraire à toute règle d'accessibilité.

      Tout élément cliquable doit être dans le code html (texte ou image dotée d'un alt pertinent), et non CSS.
      1. Contributeur
        Il n'a pas demandé l'accessibilité, il a demandé un background cliquable...
      2. Mouarf ! Ça c'est de la réponse !

        "ben quoi, il m'a demandé une corde pour se pendre, je lui ai donné puisqu'il me l'a demandé ! Où est le problème ?" :-D
      3. Contributeur
        Oups, je ne savais pas que coder salement était un crime, au temps pour moi.
    2. Contributeur
      Hello,

      Tu peux aussi appliquer à la div concerné un background ET un évènement onclick :

      <div style="text-align: left; height: 215px; background: url(images/imagespro/$image) no-repeat scroll center top transparent; padding: 0px;" onclick="window.location('monurl');">  


      Tant qu'on ne fait pas, on ne sait pas.
      1. Bonjour, tu peux mettre une img dans un lien:

        <a href="monlien"><img src="img1.jpg" width="500px" height="500px" /></a>

        ou sinon mettre un lien en display: block; et y mettre une image de fond je pense.

        #monlien {
        display: block;
        width: 500px;
        height: 500px;
        background: url('img1.jpg') no-repeat center ;
        }

        A confirmer

        +++ Spangenhelm +++