diff --git a/src/component/tooltip/TooltipHTMLContent.ts b/src/component/tooltip/TooltipHTMLContent.ts
index f03bcd8f16..272322786c 100644
--- a/src/component/tooltip/TooltipHTMLContent.ts
+++ b/src/component/tooltip/TooltipHTMLContent.ts
@@ -103,15 +103,21 @@ function assembleArrow(
     return `<div style="${styleCss.join('')}"></div>`;
 }
 
-function assembleTransition(duration: number, onlyFade?: boolean): string {
+function assembleTransition(duration: number, onlyFadeTransition: boolean, enableDisplayTransition: boolean): string {
     const transitionCurve = 'cubic-bezier(0.23,1,0.32,1)';
-    let transitionOption = ` ${duration / 2}s ${transitionCurve}`;
-    let transitionText = `opacity${transitionOption},visibility${transitionOption}`;
-    if (!onlyFade) {
+    let transitionOption = '';
+    let transitionText = '';
+    if (enableDisplayTransition) {
+        transitionOption = ` ${duration / 2}s ${transitionCurve}`;
+        transitionText = `opacity${transitionOption},visibility${transitionOption}`;
+    }
+    if (!onlyFadeTransition) {
         transitionOption = ` ${duration}s ${transitionCurve}`;
-        transitionText += env.transformSupported
-            ? `,${CSS_TRANSFORM_VENDOR}${transitionOption}`
-            : `,left${transitionOption},top${transitionOption}`;
+        transitionText += (transitionText.length ? ',' : '') + (
+            env.transformSupported
+                ? `${CSS_TRANSFORM_VENDOR}${transitionOption}`
+                : `,left${transitionOption},top${transitionOption}`
+        );
     }
 
     return CSS_TRANSITION_VENDOR + ':' + transitionText;
@@ -173,7 +179,12 @@ function assembleFont(textStyleModel: Model<TooltipOption['textStyle']>): string
     return cssText.join(';');
 }
 
-function assembleCssText(tooltipModel: Model<TooltipOption>, enableTransition?: boolean, onlyFade?: boolean) {
+function assembleCssText(
+    tooltipModel: Model<TooltipOption>,
+    enableTransition: boolean,
+    onlyFadeTransition: boolean,
+    enableDisplayTransition: boolean
+) {
     const cssText: string[] = [];
     const transitionDuration = tooltipModel.get('transitionDuration');
     const backgroundColor = tooltipModel.get('backgroundColor');
@@ -186,8 +197,9 @@ function assembleCssText(tooltipModel: Model<TooltipOption>, enableTransition?:
     const boxShadow = `${shadowOffsetX}px ${shadowOffsetY}px ${shadowBlur}px ${shadowColor}`;
 
     cssText.push('box-shadow:' + boxShadow);
-    // Animation transition. Do not animate when transitionDuration is 0.
-    enableTransition && transitionDuration && cssText.push(assembleTransition(transitionDuration, onlyFade));
+    // Animation transition. Do not animate when transitionDuration <= 0.
+    enableTransition && transitionDuration > 0
+        && cssText.push(assembleTransition(transitionDuration, onlyFadeTransition, enableDisplayTransition));
 
     if (backgroundColor) {
         cssText.push('background-color:' + backgroundColor);
@@ -284,6 +296,8 @@ class TooltipHTMLContent {
      */
     private _longHideTimeout: number;
 
+    private _enableDisplayTransition: boolean;
+
     constructor(
         api: ExtensionAPI,
         opt: TooltipContentOption
@@ -376,6 +390,9 @@ class TooltipHTMLContent {
         // update alwaysShowContent
         this._alwaysShowContent = alwaysShowContent;
 
+        this._enableDisplayTransition = tooltipModel.get('displayTransition')
+            && tooltipModel.get('transitionDuration') > 0;
+
         // update className
         this.el.className = tooltipModel.get('className') || '';
 
@@ -395,7 +412,7 @@ class TooltipHTMLContent {
         }
         else {
             style.cssText = gCssText
-                + assembleCssText(tooltipModel, !this._firstShow, this._longHide)
+                + assembleCssText(tooltipModel, !this._firstShow, this._longHide, this._enableDisplayTransition)
                 // initial transform
                 + assembleTransform(styleCoord[0], styleCoord[1], true)
                 + `border-color:${convertToColorString(nearPointColor)};`
@@ -499,8 +516,13 @@ class TooltipHTMLContent {
 
     hide() {
         const style = this.el.style;
-        style.visibility = 'hidden';
-        style.opacity = '0';
+        if (this._enableDisplayTransition) {
+            style.visibility = 'hidden';
+            style.opacity = '0';
+        }
+        else {
+            style.display = 'none';
+        }
         env.transform3dSupported && (style.willChange = '');
         this._show = false;
         this._longHideTimeout = setTimeout(() => this._longHide = true, 500) as any;
diff --git a/src/component/tooltip/TooltipModel.ts b/src/component/tooltip/TooltipModel.ts
index 351cc0549b..c9598c0a03 100644
--- a/src/component/tooltip/TooltipModel.ts
+++ b/src/component/tooltip/TooltipModel.ts
@@ -51,8 +51,6 @@ export interface TooltipOption extends CommonTooltipOption<TopLevelFormatterPara
      */
     trigger?: 'item' | 'axis' | 'none'
 
-    displayMode?: 'single' | 'multipleByCoordSys';
-
     /**
      * 'auto': use html by default, and use non-html if `document` is not defined
      * 'html': use html for tooltip
@@ -106,13 +104,11 @@ class TooltipModel extends ComponentModel<TooltipOption> {
 
         alwaysShowContent: false,
 
-        displayMode: 'single', // 'single' | 'multipleByCoordSys'
-
         renderMode: 'auto', // 'auto' | 'html' | 'richText'
 
         // whether restraint content inside viewRect.
         // If renderMode: 'richText', default true.
-        // If renderMode: 'html', defaut false (for backward compat).
+        // If renderMode: 'html', defaults to `false` (for backward compat).
         confine: null,
 
         showDelay: 0,
@@ -122,6 +118,8 @@ class TooltipModel extends ComponentModel<TooltipOption> {
         // Animation transition time, unit is second
         transitionDuration: 0.4,
 
+        displayTransition: true,
+
         enterable: false,
 
         backgroundColor: '#fff',
diff --git a/src/util/types.ts b/src/util/types.ts
index 1d085c198f..77193e15a2 100644
--- a/src/util/types.ts
+++ b/src/util/types.ts
@@ -1303,6 +1303,15 @@ export interface CommonTooltipOption<FormatterParams> {
      */
     enterable?: boolean
 
+    /**
+     * Whether enable display transition when show/hide tooltip.
+     * Defaults to `true` for backward compatibility.
+     * If set to `false`, the tooltip 'display' will be set to 'none' when hidden.
+     * @default true
+     * @since v6.0.0
+     */
+    displayTransition?: boolean
+
     backgroundColor?: ColorString
     borderColor?: ColorString
     borderRadius?: number
diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json
index c9357abedc..5e1809bfd4 100644
--- a/test/runTest/actions/__meta__.json
+++ b/test/runTest/actions/__meta__.json
@@ -201,6 +201,7 @@
   "tooltip-axisPointer2": 4,
   "tooltip-cascade": 4,
   "tooltip-component": 6,
+  "tooltip-displayTransition": 1,
   "tooltip-domnode": 1,
   "tooltip-event": 1,
   "tooltip-link": 2,
diff --git a/test/runTest/actions/tooltip-displayTransition.json b/test/runTest/actions/tooltip-displayTransition.json
new file mode 100644
index 0000000000..af61143f49
--- /dev/null
+++ b/test/runTest/actions/tooltip-displayTransition.json
@@ -0,0 +1 @@
+[{"name":"Action 1","ops":[{"type":"mousemove","time":490,"x":69,"y":44},{"type":"mousemove","time":695,"x":60,"y":65},{"type":"mousemove","time":907,"x":58,"y":83},{"type":"mousemove","time":1112,"x":58,"y":117},{"type":"mousemove","time":1323,"x":59,"y":93},{"type":"mousedown","time":1364,"x":59,"y":93},{"type":"mouseup","time":1497,"x":59,"y":93},{"time":1498,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":2225,"x":61,"y":93},{"type":"mousemove","time":2428,"x":123,"y":93},{"type":"mousedown","time":2595,"x":123,"y":93},{"type":"mouseup","time":2759,"x":123,"y":93},{"time":2760,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":3657,"x":127,"y":93},{"type":"mousemove","time":3857,"x":179,"y":98},{"type":"mousemove","time":4061,"x":213,"y":101},{"type":"mousedown","time":4251,"x":238,"y":101},{"type":"mousemove","time":4278,"x":238,"y":101},{"type":"mouseup","time":4411,"x":238,"y":101},{"time":4412,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":4923,"x":238,"y":97},{"type":"mousemove","time":5123,"x":148,"y":64},{"type":"mousemove","time":5323,"x":86,"y":83},{"type":"mousemove","time":5528,"x":71,"y":91},{"type":"mousedown","time":5615,"x":70,"y":91},{"type":"mouseup","time":5801,"x":70,"y":91},{"time":5802,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":5816,"x":70,"y":91},{"type":"mousemove","time":6723,"x":79,"y":94},{"type":"mousemove","time":6923,"x":139,"y":94},{"type":"mousemove","time":7128,"x":140,"y":94},{"type":"mousedown","time":7146,"x":140,"y":94},{"type":"mouseup","time":7328,"x":140,"y":94},{"time":7329,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":8406,"x":141,"y":94},{"type":"mousemove","time":8606,"x":346,"y":88},{"type":"mousemove","time":8806,"x":436,"y":92},{"type":"mousedown","time":8978,"x":444,"y":94},{"type":"mousemove","time":9012,"x":444,"y":94},{"type":"mouseup","time":9131,"x":444,"y":94},{"time":9132,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":9673,"x":436,"y":90},{"type":"mousemove","time":9878,"x":220,"y":38},{"type":"mousemove","time":10089,"x":112,"y":78},{"type":"mousemove","time":10289,"x":86,"y":87},{"type":"mousedown","time":10451,"x":76,"y":91},{"type":"mousemove","time":10501,"x":76,"y":91},{"type":"mouseup","time":10612,"x":76,"y":91},{"time":10613,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":11156,"x":77,"y":91},{"type":"mousemove","time":11361,"x":154,"y":94},{"type":"mousemove","time":11578,"x":160,"y":94},{"type":"mousedown","time":11854,"x":160,"y":94},{"type":"mouseup","time":12031,"x":160,"y":94},{"time":12032,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":12639,"x":162,"y":94},{"type":"mousemove","time":12839,"x":269,"y":94},{"type":"mousemove","time":13039,"x":412,"y":93},{"type":"mousemove","time":13244,"x":430,"y":93},{"type":"mousedown","time":13269,"x":430,"y":93},{"type":"mouseup","time":13417,"x":430,"y":93},{"time":13418,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":13772,"x":425,"y":92},{"type":"mousemove","time":13972,"x":160,"y":67},{"type":"mousemove","time":14172,"x":66,"y":89},{"type":"mousedown","time":14335,"x":64,"y":92},{"type":"mousemove","time":14379,"x":64,"y":92},{"type":"mouseup","time":14483,"x":64,"y":92},{"time":14484,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":14839,"x":66,"y":92},{"type":"mousemove","time":15045,"x":148,"y":92},{"type":"mousemove","time":15278,"x":149,"y":93},{"type":"mousedown","time":15497,"x":149,"y":93},{"type":"mouseup","time":15651,"x":149,"y":93},{"time":15652,"delay":400,"type":"screenshot-auto"},{"type":"mousemove","time":16155,"x":150,"y":93},{"type":"mousemove","time":16356,"x":226,"y":81},{"type":"mousemove","time":16560,"x":239,"y":70},{"type":"mousedown","time":16703,"x":239,"y":70},{"type":"mouseup","time":16829,"x":239,"y":70},{"time":16830,"delay":400,"type":"screenshot-auto"},{"type":"screenshot","time":18460}],"scrollY":0,"scrollX":0,"timestamp":1748545191575}]
\ No newline at end of file
diff --git a/test/tooltip-displayTransition.html b/test/tooltip-displayTransition.html
new file mode 100644
index 0000000000..8002166f6b
--- /dev/null
+++ b/test/tooltip-displayTransition.html
@@ -0,0 +1,142 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+
+<html>
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <script src="lib/simpleRequire.js"></script>
+        <script src="lib/config.js"></script>
+        <script src="lib/facePrint.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <link rel="stylesheet" href="lib/reset.css" />
+    </head>
+    <body>
+        <div id="main0"></div>
+
+        <script>
+
+            require([
+                'echarts'
+            ], function (echarts) {
+                var dataCount = 50;
+                var displayTransition = true;
+                var transitionDuration = 0.4;
+                var option = {
+                    tooltip: {
+                        trigger: 'axis',
+                        appendTo: 'body',
+                        confine: true,
+                        displayTransition: displayTransition,
+                        transitionDuration: transitionDuration
+                    },
+                    title: {
+                        text: [
+                            'displayTransition: ' + displayTransition,
+                            'transitionDuration: ' + transitionDuration
+                        ].join('\n')
+                    },
+                    xAxis: {
+                        type: 'category',
+                        data: new Array(dataCount).fill(0).map(function (item, index) {
+                            return 'Category ' + index;
+                        })
+                    },
+                    yAxis: {
+                        type: 'value'
+                    },
+                    series: new Array(dataCount).fill(0).map(function (item, index, arr) {
+                        return {
+                            type: 'line',
+                            name: 'Series ' + index,
+                            data: arr.map(function () {
+                                return Math.random() * 1000;
+                            }),
+                            showSymbol: false
+                        };
+                    }),
+                };
+
+                var chart = testHelper.create(echarts, 'main0', {
+                    title: [
+                        'The scrollbar **SHOULD NOT** display when tooltip is hidden with **displayTransition** disabled or **transitionDuration: 0**.',
+                    ],
+                    option: option,
+                    buttons: [
+                        {
+                            text: 'Show Tooltip',
+                            onclick: function () {
+                                chart.dispatchAction({
+                                    type: 'showTip',
+                                    seriesIndex: 0,
+                                    dataIndex: 0
+                                });
+                            }
+                        },
+                        {
+                            text: 'Hide Tooltip',
+                            onclick: function () {
+                                chart.dispatchAction({
+                                    type: 'hideTip'
+                                });
+                            }
+                        },
+                        {
+                            text: 'Toggle displayTransition',
+                            onclick: function () {
+                                displayTransition = !displayTransition;
+                                chart.setOption({
+                                    tooltip: {
+                                        displayTransition: displayTransition
+                                    },
+                                    title: {
+                                        text: [
+                                            'displayTransition: ' + displayTransition,
+                                            'transitionDuration: ' + transitionDuration
+                                        ].join('\n')
+                                    }
+                                });
+                            }
+                        },
+                        {
+                            text: 'Toggle transitionDuration',
+                            onclick: function () {
+                                transitionDuration = transitionDuration ? 0 : 0.4;
+                                chart.setOption({
+                                    tooltip: {
+                                        transitionDuration: transitionDuration
+                                    },
+                                    title: {
+                                        text: [
+                                            'displayTransition: ' + displayTransition,
+                                            'transitionDuration: ' + transitionDuration
+                                        ].join('\n')
+                                    }
+                                });
+                            }
+                        }
+                    ]
+                });
+            });
+
+        </script>
+    </body>
+</html>