對於對話框的大小,我認爲這是在評論回答時破解它。要在手機上拖動對話框[draggable : true
],您必須在源代碼中稍微改變一點。
bootstrap3的對話中也根本就沒有移動事件,如touchstart
,touchend
和touchmove
{} reference迴應。
看看的代碼行1080:
https://github.com/nakupanda/bootstrap3-dialog/blob/master/src/js/bootstrap-dialog.js#L1080
添加移動事件,以便bootstrap3的對話中可以對過於移動設備可拖動:
...
makeModalDraggable: function() {
if (this.options.draggable) {
this.getModalHeader().addClass(this.getNamespace('draggable')).on('mousedown touchstart', {
dialog: this
}, function(event) {
var dialog = event.data.dialog;
dialog.draggableData.isMouseDown = true;
var dialogOffset = dialog.getModalDialog().offset();
dialog.draggableData.mouseOffset = {
top: event.clientY - dialogOffset.top,
left: event.clientX - dialogOffset.left
};
});
this.getModal().on('mouseup mouseleave touchend touchcancel', {
dialog: this
}, function(event) {
event.data.dialog.draggableData.isMouseDown = false;
});
$('body').on('mousemove touchmove', {
dialog: this
}, function(event) {
var dialog = event.data.dialog;
if (!dialog.draggableData.isMouseDown) {
return;
}
dialog.getModalDialog().offset({
top: event.clientY - dialog.draggableData.mouseOffset.top,
left: event.clientX - dialog.draggableData.mouseOffset.left
});
});
}
return this;
},
...
注:沒有經過充分測試,但我我相信這是唯一的方法。
NB²:上面的重構僅僅是作爲一個現在和現在的解決方案。您應該在github項目網站上使用raise the issue。我相信作者們會認爲讓bootstrap3對話框移動也是一個好主意。
你可以在這裏找到不同的模態大小http://nakupanda.github.io/bootstrap3-dialog/尋找標題'更多的對話框大小',並使模態響應或你可以檢查在這個http://getbootstrap.com/javascript /#模式大小,它也支持 – Shehary
@Kokizzu發佈您的代碼爲這種模式 –
我不知道爲什麼我不能用簡單的設置重現問題-__-)/ || – Kokizzu