J'utilise jQuery redimensable pour redimensionner un div maintenant je veux faire des choses en fonction du fait que merci s ou E est sélectionné pour redimensionner essentiellement le redimensionnement est vertical ou horizontal comment faire ce
6 Réponses :
Pourriez-vous mettre en œuvre une fonction pour l'événement STOP, puis vérifier si l'élément a été redimensionné horizontalement ou verticalement à l'aide de l'ui.originalalsize et de l'UI.Size, quelque chose comme:
Non, cela ne servira pas de serveur mon objectif alors, à faire au début et lors du redimensionnement
Vous pouvez utiliser ce code dans une fonction pour l'événement de redimensionnement, qui déterminerait quelle poignée a été glissée, pas sûr de la manière dont vous pouvez y parvenir au début avant tout redimensionnement.
fait changé à ui.handle me renvoie le nom de la poignée :)
J'ai utilisé cette méthode à partir de: https://stackoverflow.com/a/13832254/1896534
var handleTarget; //set scope
$('#resize-this').resizable({
handles: 'n,e,s,w',
start: function(ui,event){
handleTarget = $(event.originalEvent.target);
},
resize: function(ui,event){
if (handleTarget.hasClass('ui-resizable-s'){
//do stuff
}
}
)};
// the following will return direction as "n", "e", "s", "se" etc.
$("#selector").resizable({
resize: function(e, ui) {
// for jquery-ui 1.9.2
var direction = $(this).data('resizable').axis;
// for jquery-ui 1.11.4
var direction = $(this).data('ui-resizable').axis;
}
});
non capturé TypeError: Impossible de lire la propriété 'Axe' d'indéfini
L'axe est placé sous forme de données sur votre élément sous ui-redisisable comme ceci:
$ (élément) .Data ('ui-redisizable'). Axe
Qu'est-ce que votre élément se réfère?
fonction (événement, ui) {var axe = $ (ui.Element) .Data ("redimensionnable"). Axe; }
une petite solution au dernier commentaire - fonction (événement, ui) {var axis = $ (ui.Element) .Data ("ui-redisizable"). Axe; }
Juste pour développer la réponse par @ user3322509:
$("#selector").resizable({
resize: function(e,ui) {
console.log( ui.element.data("ui-resizable").axis )
}
});