diff --git a/docs/examples/basic.tsx b/docs/examples/basic.tsx
index 12ce82c0..d0f4143d 100644
--- a/docs/examples/basic.tsx
+++ b/docs/examples/basic.tsx
@@ -35,6 +35,10 @@ export default function Base() {
         style={{
           marginRight: 24,
         }}
+        preview={{
+          dragRebound: false,
+          mask: 'close drag rebound'
+        }}
       />
       <Image
         src="https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*NZuwQp_vcIQAAAAAAAAAAABkARQnAQ"
diff --git a/src/Image.tsx b/src/Image.tsx
index 11c284a9..893f0c5e 100644
--- a/src/Image.tsx
+++ b/src/Image.tsx
@@ -22,6 +22,7 @@ export interface ImagePreviewType
   maskClassName?: string;
   icons?: PreviewProps['icons'];
   scaleStep?: number;
+  dragRebound?: boolean;
 }
 
 let uuid = 0;
@@ -101,6 +102,7 @@ const ImageInternal: CompoundedComponent<ImageProps> = ({
     maskClassName,
     icons,
     scaleStep,
+    dragRebound,
     ...dialogProps
   }: ImagePreviewType = typeof preview === 'object' ? preview : {};
   const src = previewSrc ?? imgSrc;
@@ -282,6 +284,7 @@ const ImageInternal: CompoundedComponent<ImageProps> = ({
           mousePosition={mousePosition}
           src={mergedSrc}
           alt={alt}
+          dragRebound={dragRebound}
           getContainer={getPreviewContainer}
           icons={icons}
           scaleStep={scaleStep}
diff --git a/src/Operations.tsx b/src/Operations.tsx
index 606db304..8a9a5d87 100644
--- a/src/Operations.tsx
+++ b/src/Operations.tsx
@@ -24,6 +24,7 @@ interface OperationsProps
   scale: number;
   onSwitchLeft: React.MouseEventHandler<HTMLDivElement>;
   onSwitchRight: React.MouseEventHandler<HTMLDivElement>;
+  onRefresh: () => void;
   onZoomIn: () => void;
   onZoomOut: () => void;
   onRotateRight: () => void;
@@ -49,6 +50,7 @@ const Operations: React.FC<OperationsProps> = (props) => {
     onSwitchLeft,
     onSwitchRight,
     onClose,
+    onRefresh,
     onZoomIn,
     onZoomOut,
     onRotateRight,
@@ -56,7 +58,7 @@ const Operations: React.FC<OperationsProps> = (props) => {
     onFlipX,
     onFlipY
   } = props;
-  const { rotateLeft, rotateRight, zoomIn, zoomOut, close, left, right, flipX, flipY } = icons;
+  const { rotateLeft, rotateRight, refresh, zoomIn, zoomOut, close, left, right, flipX, flipY } = icons;
   const toolClassName = `${prefixCls}-operations-operation`;
   const iconClassName = `${prefixCls}-operations-icon`;
   const tools = [
@@ -65,6 +67,11 @@ const Operations: React.FC<OperationsProps> = (props) => {
       onClick: onClose,
       type: 'close',
     },
+    {
+      icon: refresh,
+      onClick: onRefresh,
+      type: 'refresh',
+    },
     {
       icon: zoomIn,
       onClick: onZoomIn,
diff --git a/src/Preview.tsx b/src/Preview.tsx
index c6f78932..13a031d8 100644
--- a/src/Preview.tsx
+++ b/src/Preview.tsx
@@ -21,6 +21,7 @@ export interface PreviewProps extends Omit<IDialogPropTypes, 'onClose'> {
     rotateRight?: React.ReactNode;
     zoomIn?: React.ReactNode;
     zoomOut?: React.ReactNode;
+    refresh?: React.ReactNode;
     close?: React.ReactNode;
     left?: React.ReactNode;
     right?: React.ReactNode;
@@ -29,6 +30,7 @@ export interface PreviewProps extends Omit<IDialogPropTypes, 'onClose'> {
   };
   countRender?: (current: number, total: number) => string;
   scaleStep?: number;
+  dragRebound?: boolean;
 }
 
 const Preview: React.FC<PreviewProps> = (props) => {
@@ -45,6 +47,7 @@ const Preview: React.FC<PreviewProps> = (props) => {
     scaleStep = 0.5,
     transitionName = 'zoom',
     maskTransitionName = 'fade',
+    dragRebound = true,
     ...restProps
   } = props;
 
@@ -74,6 +77,10 @@ const Preview: React.FC<PreviewProps> = (props) => {
     resetTransform();
   };
 
+  const onRefresh = ()=> {
+    resetTransform();
+  };
+
   const onZoomIn = () => {
     dispatchZoomChange(BASE_SCALE_RATIO + scaleStep);
   };
@@ -117,6 +124,9 @@ const Preview: React.FC<PreviewProps> = (props) => {
   const onMouseUp: React.MouseEventHandler<HTMLBodyElement> = () => {
     if (visible && isMoving) {
       setMoving(false);
+      if (!dragRebound) {
+        return;
+      }
 
       /** No need to restore the position when the picture is not moved, So as not to interfere with the click */
       const { transformX, transformY } = downPositionRef.current;
@@ -298,6 +308,7 @@ const Preview: React.FC<PreviewProps> = (props) => {
         onRotateLeft={onRotateLeft}
         onFlipX={onFlipX}
         onFlipY={onFlipY}
+        onRefresh={onRefresh}
         onClose={onClose}
       />
     </>
diff --git a/tests/__snapshots__/preview.test.tsx.snap b/tests/__snapshots__/preview.test.tsx.snap
index bb9549a5..a90c67b1 100644
--- a/tests/__snapshots__/preview.test.tsx.snap
+++ b/tests/__snapshots__/preview.test.tsx.snap
@@ -79,6 +79,9 @@ exports[`Preview add rootClassName should be correct when open preview 1`] = `
       <li
         class="rc-image-preview-operations-operation rc-image-preview-operations-operation-close"
       />
+      <li
+        class="rc-image-preview-operations-operation rc-image-preview-operations-operation-refresh"
+      />
       <li
         class="rc-image-preview-operations-operation rc-image-preview-operations-operation-zoomIn"
       />
diff --git a/tests/preview.test.tsx b/tests/preview.test.tsx
index f4991d8c..efbed03e 100644
--- a/tests/preview.test.tsx
+++ b/tests/preview.test.tsx
@@ -8,6 +8,7 @@ import ZoomOutOutlined from '@ant-design/icons/ZoomOutOutlined';
 import CloseOutlined from '@ant-design/icons/CloseOutlined';
 import LeftOutlined from '@ant-design/icons/LeftOutlined';
 import RightOutlined from '@ant-design/icons/RightOutlined';
+import ReloadOutlined from '@ant-design/icons/ReloadOutlined';
 
 jest.mock('../src/Preview', () => {
   const MockPreview = (props: any) => {
@@ -118,7 +119,7 @@ describe('Preview', () => {
       jest.runAllTimers();
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[3]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[4]);
     act(() => {
       jest.runAllTimers();
     });
@@ -126,7 +127,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(1, 1, 1) rotate(90deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[4]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[5]);
     act(() => {
       jest.runAllTimers();
     });
@@ -145,7 +146,7 @@ describe('Preview', () => {
       jest.runAllTimers();
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[5]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[6]);
     act(() => {
       jest.runAllTimers();
     });
@@ -153,7 +154,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(-1, 1, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[6]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[7]);
     act(() => {
       jest.runAllTimers();
     });
@@ -161,7 +162,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(-1, -1, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[5]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[6]);
     act(() => {
       jest.runAllTimers();
     });
@@ -169,7 +170,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(1, -1, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[6]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[7]);
     act(() => {
       jest.runAllTimers();
     });
@@ -188,7 +189,7 @@ describe('Preview', () => {
       jest.runAllTimers();
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[3]);
     act(() => {
       jest.runAllTimers();
     });
@@ -196,7 +197,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(1, 1, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[1]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
     act(() => {
       jest.runAllTimers();
     });
@@ -204,7 +205,7 @@ describe('Preview', () => {
       transform: 'translate3d(-256px, -192px, 0) scale3d(1.5, 1.5, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[3]);
     act(() => {
       jest.runAllTimers();
     });
@@ -261,7 +262,7 @@ describe('Preview', () => {
       jest.runAllTimers();
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[3]);
     act(() => {
       jest.runAllTimers();
     });
@@ -269,7 +270,7 @@ describe('Preview', () => {
       transform: 'translate3d(0px, 0px, 0) scale3d(1, 1, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[1]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
     act(() => {
       jest.runAllTimers();
     });
@@ -277,7 +278,7 @@ describe('Preview', () => {
       transform: 'translate3d(-512px, -384px, 0) scale3d(2, 2, 1) rotate(0deg)',
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[3]);
     act(() => {
       jest.runAllTimers();
     });
@@ -317,7 +318,7 @@ describe('Preview', () => {
       jest.runAllTimers();
     });
 
-    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[1]);
+    fireEvent.click(document.querySelectorAll('.rc-image-preview-operations-operation')[2]);
     act(() => {
       jest.runAllTimers();
     });
@@ -572,6 +573,7 @@ describe('Preview', () => {
           zoomIn: <ZoomInOutlined />,
           zoomOut: <ZoomOutOutlined />,
           close: <CloseOutlined />,
+          refresh: <ReloadOutlined />,
           left: <LeftOutlined />,
           right: <RightOutlined />,
         }}