2017-05-01 1 views
2

je le code suivant, qui permet le redimensionnement de deux panneaux séparés par un séparateur-div (extrait de this great example par Rick Strahl)jQuery-redimensionnable: Redimensionner cas de div ne se déclenche pas

Je suis en train pour déclencher un événement de redimensionnement mais en quelque sorte ce n'est pas enregistré. Des idées de ce qui me manque ici? Merci déjà.

$(".flex-item-top").resizable({ 
     handleSelector: ".splitter", 
     resizeWidth: false, 
     resize: function(event, ui) { 
     console.log("Let's get schwifty!") 
     } 
    }) 

CodePen

EDIT: Un peu en retard, mais je n'ai toujours pas compris pourquoi l'événement ne se déclenche pas. Cependant, pour l'instant je trouve une solution par un événement « drag », que j'ai trouvé dans un autre post débordement de la pile, peut-être il est utile à quelqu'un :)

var isDragging = false; 
$(".splitter") 
.mousedown(function() { 
    isDragging = true; 
}) 
.mousemove(function() { 
    if (isDragging) { 
    console.log('hello') 
    } 
}) 
.mouseup(function() { 
    isDragging = false; 
}) 

Répondre

0

Alors que j'ai trouvé est qu'il ya une sorte de conflit entre jQuery-UI et la bibliothèque resizeable.js appelée. Lorsque vous omettez la bibliothèque jQuery-UI, vous obtenez le mouvement du séparateur.

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script type="text/javascript" src="https://rawgit.com/RickStrahl/jquery-resizable/master/src/jquery-resizable.js"></script> 

Ceux-ci devraient être les seules bibliothèques que vous appelez.