archive-gh-me/react-viewer
1
0
Fork 0
mirror of https://github.com/infeng/react-viewer.git synced 2025-12-08 17:36:40 +00:00
Code Issues Projects Releases Wiki Activity

If used container, scroll page outside Viewer should don't affect Viewer

Browse Source
This commit is contained in:
Toxblh 2018-03-09 16:56:46 +00:00
parent 0432bb55d0
commit 1b9534d93b
2 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/ViewerCanvas.tsx
View File

@ -18,6 +18,7 @@ export interface ViewerCanvasProps {
scaleY: number;
loading: boolean;
drag: boolean;
container: HTMLElement;
onCanvasMouseDown: (e: React.MouseEvent<HTMLDivElement>) => void;
}
@ -110,8 +111,15 @@ export default class ViewerCanvas extends React.Component<ViewerCanvasProps, Vie
if (remove) {
funcName = 'removeEventListener';
}
document[funcName]('DOMMouseScroll', this.handleMouseScroll, false);
document[funcName]('mousewheel', this.handleMouseScroll, false);
let mouseScrollArea: Document | HTMLElement = document;
if (this.props.container) {
mouseScrollArea = this.props.container;
}
mouseScrollArea[funcName]('DOMMouseScroll', this.handleMouseScroll, false);
mouseScrollArea[funcName]('mousewheel', this.handleMouseScroll, false);
document[funcName]('click', this.handleMouseUp, false);
document[funcName]('mousemove', this.handleMouseMove, false);
window[funcName]('resize', this.handleResize, false);
@ -147,7 +155,7 @@ export default class ViewerCanvas extends React.Component<ViewerCanvasProps, Vie
let imgStyle: React.CSSProperties = {
width: `${this.props.width}px`,
height: `${this.props.height}px`,
transform: `translateX(${this.props.left ? this.props.left + 'px' : 'aoto'}) translateY(${this.props.top}px)
transform: `translateX(${this.props.left ? this.props.left + 'px' : 'aoto'}) translateY(${this.props.top}px)
rotate(${this.props.rotate}deg) scaleX(${this.props.scaleX}) scaleY(${this.props.scaleY})`,
};

1
src/ViewerCore.tsx
View File

@ -524,6 +524,7 @@ export default class ViewerCore extends React.Component<ViewerProps, ViewerCoreS
scaleY={this.state.scaleY}
loading={this.state.loading}
drag={this.props.drag}
container={this.props.container}
onCanvasMouseDown={this.handleCanvasMouseDown}
/>
<div className={`${this.prefixCls}-footer`} style={{zIndex: zIndex + 5}}>