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

Merge pull request #23 from Toxblh/master

Browse Source 
If used container, scroll page outside Viewer shouldn't affect Viewer
This commit is contained in:
feng zhi hao 2018-03-12 10:47:20 +08:00 committed by GitHub
commit 9952c834b6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
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}}>