jQuery Girl
  1. jQuery Girl
  3. jQuery UI redimensionnable: hauteur auto en utilisant la poignée est seule
Intereting Posts
boucle avec intervalle défini à l’intérieur jQuery fondu dans la couleur de fond Comment append une fonction onclick pour un bouton créé par programme bouton de retour dans une iframe en utilisant history.js échec de getJSON, JSON valide Idiom JavaScript: créer une fonction uniquement pour l’invoquer Comment obtenir le texte d’étiquette du bouton radio sélectionné à l’aide de jQuery Vérifier si le bouton radio spécifique est coché Comment obtenir la valeur CSS réelle avec jQuery? Amélioration de l’utilisation des boutons radio pour activer / désactiver les champs de formulaire jQuery différé ne fonctionne pas IE8 et pointeurs null jQuery Comment faire fonctionner jQuery Mobile Magic dans le gestionnaire d’événements «pageshow»? (JQM 1.1.0) Puis-je lire des données de web.config à l’aide de JQuery? Pourquoi mon gestionnaire de succès ajax Jquery est-il appelé avec un tableau (et non l’object de réponse)

jQuery UI redimensionnable: hauteur auto en utilisant la poignée est seule

j’ai un jqueryui re-sizable div. Je veux seulement que la largeur soit redimensionnable et que la hauteur rest automatique, de sorte que la div augmente ou diminue avec le contenu. Si je le configure pour afficher uniquement la poignée est et utilise css height:auto , la hauteur est également définie après le redimensionnement, même si seule la largeur a été modifiée. Je dois régler la hauteur pour redimensionner automatiquement l’événement comme suit: 

 resize: function(event, ui) { $(this).css('height', 'auto'); }

pour empêcher le réglage de la hauteur. Existe-t-il un meilleur moyen d’empêcher la prise de hauteur lorsque seul le manche est est utilisé?

Essayez de définir un rapport hauteur / largeur ET la propriété handles: 

  $( "#resizable" ).resizable({ aspectRatio: 16 / 9, handles: 'e' });

Ce qui précède créera un conteneur qui sera automatiquement redimensionné au format 16/9, uniquement avec une poignée du côté est du conteneur.

Voici la description du site de documentation à l’ adresse http://jqueryui.com/demos/resizable/#option-containment :

S’il est spécifié en tant que chaîne, doit être une liste de tous les éléments suivants: ‘n, e, s, w, ne, se, sw, nw, tous’. Les descripteurs nécessaires seront générés automatiquement par le plugin.

Si spécifié en tant qu’object, les clés suivantes sont sockets en charge: {n, e, s, w, ne, se, sw, nw}. La valeur de l’une des valeurs spécifiées doit être un sélecteur jQuery correspondant à l’élément enfant du redimensionnable à utiliser en tant que ce descripteur. Si le descripteur n’est pas un enfant du redimensionnable, vous pouvez passer directement l’object DOMElement ou un object jQuery valide.

Exemples de code

Initialisez un redimensionnable avec l’option handles spécifiée. 

 $( ".selector" ).resizable({ handles: 'n, e, s, w' });

Récupère ou définit l’option des poignées, après init. 

 //getter var handles = $( ".selector" ).resizable( "option", "handles" ); //setter $( ".selector" ).resizable( "option", "handles", 'n, e, s, w' );