1
私はそれを持っているので、ユーザーが要素をドラッグしているときに "overflow:auto"に設定されたdiv要素がスクロールします。角度2 window.scrollToは機能しませんか?
要素の動作をドラッグなど(例えば、またX/Y初期ドラッグ(onDragStart時位置)とマウスが移動している現在のX/Y位置として。
Iを適切なマウスデータを取得しませんおそらくオフの私のロジックを実現するが、私はもっとスクロールするdiv要素を取得しようとしているだけです。何が間違っているかについての洞察力は大いに評価されるでしょう...
注:Angular 1をAngling 2のように表示するng-metadataを使用していますが、Angular 1またはAngular 2のガイダンスは参考になります。
@autobind
onDragStart({clientX, clientY}) {
this.initY = clientY;
if (this.isDragging) return;
document.addEventListener('mousemove', this.dragListener = (e) => {
e.preventDefault();
if (Math.max(Math.abs(e.clientX - clientX), Math.abs(e.clientY - clientY)) > 3) {
document.removeEventListener('mousemove', this.dragListener);
document.addEventListener('mousemove', this.onDrag);
this.dragListener = this.onDrag;
this.fileService.dragSource = this.file;
// onDrag needs to be called before Angular can set the proper classes
this._element.toggleClass('dragging', this.isDragging);
this._element.toggleClass('bulk-dragging', this.inBulkDragOp);
this.onDragScroll(e);
this.onDrag(e);
this.drag.emit();
this._scope.$applyAsync();
}
});
}
@autobind
onDrag(e) {
console.log("Dragging...");
console.log(e);
var currentY = e.clientY;
var range = 100; // Range of 100px before scrolling begins... May need tweaking if too responsive
if (currentY > this.initY + range) {
console.log("SCROLL DOWN");
window.scrollTo(0, 500);
} else if (currentY < this.initY - range) {
console.log("SCROLL UP");
}
e.preventDefault();
this._element.css('transform', `translate(${e.clientX - this._element[0].clientWidth/2}px, ${e.clientY - this._element[0].clientHeight/2}px)`);
}