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

Bibliothèques & Frameworks Discussion :

Conserver les proportions


Sujet :

Bibliothèques & Frameworks

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Inscrit en
    Mars 2009
    Messages
    77
    Détails du profil
    Informations forums :
    Inscription : Mars 2009
    Messages : 77
    Par défaut Conserver les proportions
    Bonjour,

    Avec slider.constructor je construit un slider (issu de la bibliothèque Scriptaculous).

    Ce slider crée un zoom

    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
     (function() {
        var zoom_slider = $('zoom_slider'),
            rgb_slider = $('rgb_slider'),
            box = $('drag_demo_1');
     
     
     
     
        new Control.Slider(zoom_slider.down('.handle'), zoom_slider, {
          range: $R(20, 180),
          sliderValue: 100,
          onSlide: function(value) {
     
    		  var x = document.getElementById("drag_demo_1").getDimensions().width;
              var y = document.getElementById("drag_demo_1").getDimensions().height;
              var coeff_im = y / x;
     
            box.setStyle({ width: value + 'px', height: (value*coeff_im) + 'px' });
          },
          onChange: function(value) { 
     
    	  var drag = value;
            box.setStyle({ width: value + 'px', height: (value*coeff_im) + 'px' });
     
     
          }
        });
      })();
    Mon problème se situe dans le cacul de la variable coeff_im (coefficient hauteur/largeur).

    Le calcul n'est pas bon mais je ne parvient pas à trouver ou ?

    Jspr que jai été assez clair.

  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 : 55
    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
    Salut,
    getDimensions() est une propriété des elements Prototype, il est donc important d'étendre les éléments HTML avec la fonction $.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    var x = $("drag_demo_1").getDimensions().width;
    var y = $("drag_demo_1").getDimensions().height;
    var coeff_im = y / x;
    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
    Membre confirmé
    Inscrit en
    Mars 2009
    Messages
    77
    Détails du profil
    Informations forums :
    Inscription : Mars 2009
    Messages : 77
    Par défaut
    Citation Envoyé par Bovino Voir le message
    Salut,
    getDimensions() est une propriété des elements Prototype, il est donc important d'étendre les éléments HTML avec la fonction $.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    var x = $("drag_demo_1").getDimensions().width;
    var y = $("drag_demo_1").getDimensions().height;
    var coeff_im = y / x;
    merci Bovino c'est sa!

    Il y à également :
    element.style.width
    element.style.height

Discussions similaires

  1. Réponses: 14
    Dernier message: 14/07/2015, 18h22
  2. Réponses: 11
    Dernier message: 29/07/2014, 03h40
  3. Réponses: 2
    Dernier message: 10/01/2008, 18h44
  4. Redimensionnement d'images conservant les proportions
    Par progfou dans le forum Traitement d'images
    Réponses: 12
    Dernier message: 02/10/2007, 13h29
  5. Conserver les retours à la ligne
    Par arwen dans le forum ASP
    Réponses: 2
    Dernier message: 04/12/2003, 13h50

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