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

JavaScript Discussion :

Resize window & deplacement image


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre émérite Avatar de Ramajb
    Homme Profil pro
    ----------------------------
    Inscrit en
    Septembre 2007
    Messages
    476
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : ----------------------------

    Informations forums :
    Inscription : Septembre 2007
    Messages : 476
    Par défaut Resize window & deplacement image
    Bonjour,

    Comment fait-on pour positionner une image en fonction de la taille de la fenêtre. Quand l'utilisateur redimensionne la fenêtre du navigateur de droite vers la gauche, l'image se met en déplacement automatiquement.
    Est qu'on peut faire ça en javascript?

    Merci

  2. #2
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    window.onresize = function(){
        // Ton code
    }
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  3. #3
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Par défaut
    Bonsoir,

    Pour le mettre dans une position précise ou selon la dimension de la fenêtre, regarde aussi "style.top" , "style.left" et window.innerHeight/Width.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    window.onresize = function(){
        // Ton code
    document.getElementById("idImage").style.top=(window.innerHeight - 120)+"px";
    }

  4. #4
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Par défaut
    Euh, pour IE utilise document.documentElement.clientWidth/Height;
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    window.onresize = function(){
        // Ton code
    var largeur=0;
    var hauteur=0;
    if(document.all){
      largeur= document.documentElement.clientWidth;
      hauteur = document.documentElement.clientHeight;
    }else{
      largeur= window.innerWidth;
      hauteur = window.innerHeight ;
    }
    document.getElementById("idImage").style.top=(hauteur - 120)+"px";
    document.getElementById("idImage").style.left=(largeur - 80)+"px";
    }
    A+.

  5. #5
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    Citation Envoyé par andry.aime
    Euh, pour IE utilise document.documentElement.clientWidth/Height;
    Ca dépend
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    var hauteur = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  6. #6
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Par défaut
    Citation Envoyé par Bovino Voir le message
    Ca dépend
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    ... document.body.clientHeight;
    C'est pour quel navigateur?

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

Discussions similaires

  1. Windows Form et images
    Par adenoula dans le forum C#
    Réponses: 4
    Dernier message: 06/08/2012, 17h43
  2. resize window sous IE
    Par viny dans le forum jQuery
    Réponses: 6
    Dernier message: 17/01/2011, 17h08
  3. controler un resize window
    Par viny dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 14/01/2011, 12h14
  4. Deplacement image auto
    Par nico72 dans le forum jQuery
    Réponses: 13
    Dernier message: 01/08/2010, 22h56

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