[Javascript - CSS ] zoom image reactif

john -  
bg62 Messages postés 23433 Date d'inscription   Statut Modérateur Dernière intervention   -
Bonjour

je souhaite faire une sorte de zoom image au passage de la souris , mais avec cependant la possibilite d'avoir des zones reactives dans la fenetre de zoom

j'ai deja reussi a faire mon zoom en feuille de style css avec un :hover
mais comment faire des zone de selection dans cette fenetre de zoom ?
merci d'avance

6 réponses

  1. Zep3k!GnO Messages postés 2049 Statut Membre 200
     
    mais la je sais pas comment definir d'autres zones sur cette image la vu que c dans du code css

    Bah au lieu d'appliquer #zone1 a ton image tu dois faire une autre map en CSS sur le modèle de #zone1 mais tu l'appelles #zone2 et c'est elle que t'appliques a ton image , non ?!

    Zep3k!GnO
    -->hi i hi o on va pas au boulot :P
    1
  2. syphaks Messages postés 9 Statut Membre 1
     
    bjr a vous,

    en fait ce qu'il veut dire c'est ca:

    tu as une premiere image (Photo1) ok.

    Photo1=> tu lui aplike un zoom1 en css. Ce zoom1 est en fait une autre image appelé Photo2. ensuite tu répéte ton code comme tu le souhaites.
    Photo2=> tu lui applike un zoom2 en définissant ce dernier sur ton css.

    c clair??
    1
  3. StreM Messages postés 515 Statut Membre 124
     
    Salut,
    renseigne toi sur les balises MAP et AREA.
    Mais ton message n'est pas très clair...
    0
  4. john
     
    merci pour la reponse , mais j'ai deja regarde du cote des balise MAP et AREA :)

    Effectivement , a la relecture , mon message est plutot confus

    en fait , j'ai une image de fond , avec des zones reactives ( MAP , AREA ) , qui au survol de la souris , affichent un cadre representant un zoom de la partie survolee.

    ce que j'aimerai avoir c'est dans ce cadre de zoom qui s'affiche , avoir d'autres zones reactives sur lequelles on pourrait clicker

    une mise en abime en sorte
    une zone qui affiche un cadre , et dans ce cadre d'autres zones ..

    le tout en restant dans la meme page

    Suis-je plus clair la ?
    ( j'ai pas trop l'impression :/ )
    0
    1. Zep3k!GnO Messages postés 2049 Statut Membre 200
       
      ben pourquoi tu refais pas des images pour tes zones de ZOOM ( ton image en grand ) et sur ces nouvelles images, tu places tes MAP et toyt le tralala.... ?!


      Zep3k!GnO
      -->hi i hi o on va aps au boulot :P
      0
      1. john > Zep3k!GnO Messages postés 2049 Statut Membre
         
        ben c'est deja une autre image le zoom ( zone1.jpg)

        voila le code css

        #zone1:hover {
        width : 216px;
        height: 169px;
        left: 110px;
        top: 15px;
        border: 1px dotted white;
        background: url(zone1.jpg) top left no-repeat;
        z-index: 100;
        }

        mais la je sais pas comment definir d'autres zones sur cette image la vu que c dans du code css
        0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. John
     
    j'vois pas vraiment ce que tu veux dire ....

    Concretement ca donne quoi ?
    0
  7. bg62 Messages postés 23433 Date d'inscription   Statut Modérateur Dernière intervention   2 435
     
    bonjour
    ... allez .. je "repique ma crise" :
    ce forum est un forum d'entraide, l'inscription y est gratuite, alors pourquoi rester 'anonyme' ?
    cela ne coûte rien de s'inscrire, et c'est beaucoup plus sympa vis-à-vis de ceux qui voudront vous aider ...
    @+
    b g
    0