9
Dans ce plunk j'ai un modal d'interface utilisateur angulaire avec une barre de titre de draggable. Lorsque vous faites glisser la barre, l'ensemble du mouvement se déplace. Le problème est que si je déplace la souris relativement rapidement de haut en bas, le curseur perd le focus sur la barre et le modal arrête de bouger. Une idée de comment réparer ça? Toute autre méthode est également la bienvenue.L'interface utilisateur angulaire déplaçable Modal perd le focus
HTML
<body ng-app="app" ng-controller="ctl">
<script type="text/ng-template" id="myModalContent.html">
<div class="topbar">This is the title</div>
<div class="modal-header">
<h3 class="modal-title" id="modal-title">I'm a modal!</h3>
</div>
<div class="modal-footer">
<button class="btn btn-primary" type="button" ng-click="ok()">OK</button>
</div>
</script>
<button type="button" class="btn btn-default" ng-click="open()">Open me!</button>
</body>
Javascript
var app = angular.module("app", ['ui.bootstrap']);
app.controller("ctl", function($scope,$uibModal,$timeout) {
var modalInstance;
$scope.open = function() {
modalInstance = $uibModal.open({
animation: false,
windowClass: 'the-modal',
templateUrl: 'myModalContent.html'
});
$timeout(function(){
$('.modal-content').draggable({
drag: function(event, ui) {
if(event.toElement.className.indexOf("topbar") == -1) return false;
}
});
},10);
};
});
J'ai couru le Plunker et il se comporte très étrangement - comme il perd la traînée à un moment donné. Le code est si simple qu'il ne peut y avoir rien de mal. Je suis perplexe :( – Mikkel