IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Décaler une image


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre Expert
    Avatar de laurentSc
    Homme Profil pro
    Webmaster débutant perpétuel !
    Inscrit en
    Octobre 2006
    Messages
    10 493
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Webmaster débutant perpétuel !
    Secteur : Industrie

    Informations forums :
    Inscription : Octobre 2006
    Messages : 10 493
    Billets dans le blog
    1
    Par défaut Décaler une image
    Bonsoir,

    je n'arrive pas à décaler une image sur une page. Je mets ici le code largement épuré, mais qui illustre le problème. Comme c'est un vieux code que je modifie, il y a plein de trucs inutiles et qui doivent nuire à la compréhension.
    En gros, il y a 2 images mappées (zone map), pour faire des popups basées sur des divs, suivies d'une image logée dans une table et c'est celle-ci que je n'arrive pas à décaler à droite.
    Voici le code :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
     
    <table border="0" width="630">
      <tbody>
        <tr>
          <td valign="top" width="350">
          <table>
            <tbody>
              <tr>
                <td></td>
                <td>
                <center><b>Nouveaut&eacute;s</b></center>
                </td>
              </tr>
              <tr>
                <td style="width: 50px;" height="350"></td>
                <td>
                <div onmouseover="LayerDelive.style.visibility='visible'"
     onmouseout="LayerDelive.style.visibility='hidden'"
     id="LayerDelive"
     style="z-index: 2; left: 120px; width: 540px; position: absolute; top: 35px; height: 150px; background-color: rgb(255, 255, 255); visibility: visible;">
                <p>Coucou 1</p>
                </div>
                <div id="Layer1"
     style="z-index: 1; left: 50px; width: 107px; position: absolute; top: 80px; height: 100px;"><font
     color="#000000" face="Arial" size="2"><font
     color="#000000" face="Arial" size="2"><img
     src="http://docexterne.fr.schneider-electric.com/Documentation/portail/images/nouveautes.gif"
     usemap="#Map" border="0"> <map name="Map">
                <area
     onmouseover="LayerDelive.style.visibility='visible'"
     shape="rect" coords="8,16,87,78">
                <area onmouseout="LayerDelive.style.visibility='hidden'"
     shape="RECT" coords="3,1,94,99">
                </map>
                </font></font></div>
                </td>
              </tr>
            </tbody>
          </table>
          <p></p>
          <table>
            <tbody>
              <tr height="350">
              </tr>
            </tbody>
          </table>
          <div onmouseover="LayerDelive2.style.visibility='visible'"
     onmouseout="LayerDelive2.style.visibility='hidden'"
     id="LayerDelive2"
     style="z-index: 2; left: 150px; width: 0px; position: absolute; top: 200px; height: 0px; background-color: rgb(255, 255, 255); visibility: hidden;">
    Coucou<br>
          </div>
          <div id="Layer1"
     style="z-index: 1; left: 50px; width: 0px; position: absolute; top: 250px; height: 0px;"><font
     color="#000000" face="Arial" size="2"><font
     color="#000000" face="Arial" size="2"><img
     src="http://docexterne.fr.schneider-electric.com/Documentation/portail/images/recheureka30.gif"
     usemap="#Map2" border="0"> <map name="Map2">
          <area onmouseover="LayerDelive2.style.visibility='visible'"
     shape="rect" coords="2,11,82,70">
          <area onmouseout="LayerDelive2.style.visibility='hidden'"
     shape="RECT" coords="0,0,100,100">
          </map>
          </font></font></div>
          <div style="left: 500px;">
          <table>
            <tbody>
              <tr>
                <td style="width: 20px;"></td>
                <td>
      <a target="_blank"
     href="http://www.stdswebport.org/index.php?langue=en"> <img
     src="http://docexterne.fr.schneider-electric.com/documentation/portail/images/stdwebportcligno.gif"
     alt="Toutes les normes utiles" border="0"> </a>
                </td>
              </tr>
            </tbody>
          </table>
          </div>
    <!--Fin--> </td>
        </tr>
      </tbody>
    </table>
    Les termes anglais viennent du fait qu'une partie du code a été faite par une américaine, et les URLs d'image proviennent d'un site intranet.

  2. #2
    Expert confirmé
    Avatar de vodiem
    Homme Profil pro
    Vivre
    Inscrit en
    Avril 2006
    Messages
    2 895
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Bouches du Rhône (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Vivre
    Secteur : Conseil

    Informations forums :
    Inscription : Avril 2006
    Messages : 2 895
    Par défaut
    salut laurentSc,

    je suis pas sur d'avoir compris le pb... c'est pas ca qu'il te faut ? :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <div style="position:absolute;left: 500px;">

  3. #3
    Membre Expert
    Avatar de laurentSc
    Homme Profil pro
    Webmaster débutant perpétuel !
    Inscrit en
    Octobre 2006
    Messages
    10 493
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 61
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Activité : Webmaster débutant perpétuel !
    Secteur : Industrie

    Informations forums :
    Inscription : Octobre 2006
    Messages : 10 493
    Billets dans le blog
    1
    Par défaut
    Nickel...sauf que même si je divise 500 par 10, ça fait encore bcp...

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Décaler une image verticalement de quelques pixels
    Par Federico_muy_bien dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 05/12/2014, 15h16
  2. Décaler une image pour qu'elle couvre 2 espaces
    Par sebiv dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 28/11/2014, 09h22
  3. Réponses: 3
    Dernier message: 18/02/2013, 12h09
  4. Décaler une image au survol de la souris
    Par malabarbe dans le forum Mise en page CSS
    Réponses: 9
    Dernier message: 29/08/2009, 00h21
  5. Décaler une image au survol de la souris
    Par malabarbe dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 28/08/2009, 13h43

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo