Ce jQuery vous permet de contraindre le mouvement de la glissade afin qu'il ne se produise que sur l'axe spécifié: voir: http://jqueryui.com/demos/draggable/#constrain-movement Ce n'est pas légal JQuery mais je souhaite que ce soit: est-il possible d'empêcher que l'utilisateur de créer #Container plus large tout en lui permettant de le rendre plus grand? Merci
4 Réponses :
Je vois que vous voyez deux façons de faire cela, une meilleure que l'autre. Le meilleur d'abord:
1) Définissez Minwidth et MaxWidth sur la même valeur (à savoir la valeur que vous souhaitez que la largeur reste). 2) Créer un parent élément avec largeur fixe et faire que le confinement. Je ne sais pas comment cela fonctionnera sur la hauteur, mais par défaut, un div sans hauteur spécifiée augmente si son contenu peut fonctionner, donc cela pourrait fonctionner.
Merci pour la suggestion, Tomas. Malheureusement, quand œuvre est contenue à l'intérieur #Container et #Container n'a pas de hauteur explicite: $ ("# the-thuse"). Resizable ({Minheight: 150, confinement: '#Container'}) alors peu de choses ne peuvent pas être redimensionnées verticalement. #Container ne pousse tout simplement pas au-delà de la hauteur qu'il a besoin de rendre #Teigne dans la première place.
@Tim, avez-vous essayé l'inverse de l'autre sens - régler min et max largeur à la même valeur? C'est ce que je ferais, plutôt que d'avoir un conteneur.
Oui, il est possible en utilisant des événements de l'interface utilisateur. Le long de l'axe des x: ou le long de l'axe Y:
Cela peut ne plus fonctionner. J'ai essayé de coder dur l'UI.Size.Width dans l'événement de redimensionnement et j'ai constaté qu'il était ignoré. Peut-être que certains changements à JQuery cassèrent cette solution.
s'avère que cela fonctionnera dans JQuery UI 1.9 mais pas 1.10; Je l'ai soumis comme un bug
Ces deux réponses fonctionnent, mais elles ont la conséquence malheureuse de montrer un curseur sur la frontière orientale, ce qui rend l'utilisateur à penser qu'il pourrait être en mesure de redimensionner la largeur. Ce que je pense, c'est un meilleur match, c'est d'appeler ceci sur l'objet JQuery:
.resizable({handles:'s'})
Aimer cette réponse. UI Friendly, qui est un peu le point. Si vous avez déjà décidé d'utiliser un fantôme ou un assistant, les autres méthodes entraîneraient induire en erreur et éventuellement frustrer vos utilisateurs. C'est simple, élégant, et non intensif du processeur. Notez également que vous pouvez utiliser {poignées: 's, n'} ou {poignées: 'n'} Si vous le souhaitez, vous n'êtes pas limité à la possibilité de pouvoir être capable. redimensionner sur le bord inférieur
Merci pour cette réponse Thumbs Up!
Cela fonctionne également avec BOOTSTRAP, la réponse acceptée provoque une faible vitesse de la zone redimensionnée chaque fois que vous redimensionnez.
J'ai trouvé que juste effacer sur la hauteur ou la largeur de style en ligne sur l'objet sur le redimensionnement fonctionne également. Il a également l'avantage supplémentaire de ne pas être lié aux dimensions originales de l'objet (car celles-ci pourraient changer en fonction du contenu)
$("#Container").resizable({
resize: function(event, ui) {
$(this).css('height','');
}
});
C'est une excellente solution. J'ai une réévaluable vraiment haute, donc je ne montre que la poignée sur le coin SE , sinon il serait manqué. Le réglage de la hauteur max et min n'a pas semblé fonctionner compte tenu du contenu de la volonté, car le redimensionnement se produit.
La seule solution de travail ici, en tenant compte de la dernière version de JQuery UI. Merci.