diff --git a/api-generator/components/tooltip.js b/api-generator/components/tooltip.js
index b8fd76c6f4..39292a1f7a 100644
--- a/api-generator/components/tooltip.js
+++ b/api-generator/components/tooltip.js
@@ -57,7 +57,7 @@ const TooltipProps = [
         name: 'event',
         type: 'string',
         default: 'hover',
-        description: 'Event to show the tooltip, valid values are hover and focus.'
+        description: 'Event to show the tooltip, valid values are hover, focus, and both.'
     },
     {
         name: 'showEvent',
diff --git a/components/doc/tooltip/index.js b/components/doc/tooltip/index.js
index 5449e9c599..cb840189a7 100644
--- a/components/doc/tooltip/index.js
+++ b/components/doc/tooltip/index.js
@@ -1,8 +1,8 @@
 import React, { memo } from 'react';
-import { TabView, TabPanel } from '../../lib/tabview/TabView';
-import { useLiveEditorTabs } from '../common/liveeditor';
+import { TabPanel, TabView } from '../../lib/tabview/TabView';
 import { CodeHighlight } from '../common/codehighlight';
 import { DevelopmentSection } from '../common/developmentsection';
+import { useLiveEditorTabs } from '../common/liveeditor';
 
 const TooltipDoc = memo(() => {
     const sources = {
@@ -581,7 +581,7 @@ import { Tooltip } from 'primereact/tooltip';
                     </CodeHighlight>
 
                     <h5>Events</h5>
-                    <p>Tooltip gets displayed on hover event of its target by default, other option is the focus event to display and blur to hide.</p>
+                    <p>Tooltip gets displayed on hover event of its target by default, other option is the focus event to display and blur to hide. You can set it to 'both' to allow for both hover and focus events.</p>
                     <CodeHighlight>
                         {`
 <InputText type="text" placeholder="Right" tooltip="Enter your username" tooltipOptions={{event: 'focus'}}/>
@@ -679,7 +679,7 @@ import { Tooltip } from 'primereact/tooltip';
                                     <td>event</td>
                                     <td>string</td>
                                     <td>hover</td>
-                                    <td>Event to show the tooltip, valid values are hover and focus.</td>
+                                    <td>Event to show the tooltip, valid values are hover, focus, and both.</td>
                                 </tr>
                                 <tr>
                                     <td>showEvent</td>
diff --git a/components/lib/tooltip/Tooltip.js b/components/lib/tooltip/Tooltip.js
index f5346fbe5e..58d8af524d 100644
--- a/components/lib/tooltip/Tooltip.js
+++ b/components/lib/tooltip/Tooltip.js
@@ -64,21 +64,25 @@ export const Tooltip = React.memo(
         };
 
         const getEvents = (target) => {
-            let showEvent = getTargetOption(target, 'showevent') || props.showEvent;
-            let hideEvent = getTargetOption(target, 'hideevent') || props.hideEvent;
+            let showEvents = [getTargetOption(target, 'showevent') || props.showEvent];
+            let hideEvents = [getTargetOption(target, 'hideevent') || props.hideEvent];
 
             if (isMouseTrack(target)) {
-                showEvent = 'mousemove';
-                hideEvent = 'mouseleave';
+                showEvents = ['mousemove'];
+                hideEvents = ['mouseleave'];
             } else {
                 const event = getTargetOption(target, 'event') || props.event;
                 if (event === 'focus') {
-                    showEvent = 'focus';
-                    hideEvent = 'blur';
+                    showEvents = ['focus'];
+                    hideEvents = ['blur'];
+                }
+                if (event === 'both') {
+                    showEvents = ['focus', 'mouseenter'];
+                    hideEvents = ['blur', 'mouseleave'];
                 }
             }
 
-            return { showEvent, hideEvent };
+            return { showEvents, hideEvents };
         };
 
         const getPosition = (target) => {
@@ -271,19 +275,19 @@ export const Tooltip = React.memo(
 
         const bindTargetEvent = (target) => {
             if (target) {
-                const { showEvent, hideEvent } = getEvents(target);
+                const { showEvents, hideEvents } = getEvents(target);
                 const currentTarget = getTarget(target);
-                currentTarget.addEventListener(showEvent, show);
-                currentTarget.addEventListener(hideEvent, hide);
+                showEvents.forEach((event) => currentTarget.addEventListener(event, show));
+                hideEvents.forEach((event) => currentTarget.addEventListener(event, hide));
             }
         };
 
         const unbindTargetEvent = (target) => {
             if (target) {
-                const { showEvent, hideEvent } = getEvents(target);
+                const { showEvents, hideEvents } = getEvents(target);
                 const currentTarget = getTarget(target);
-                currentTarget.removeEventListener(showEvent, show);
-                currentTarget.removeEventListener(hideEvent, hide);
+                showEvents.forEach((event) => currentTarget.removeEventListener(event, show));
+                hideEvents.forEach((event) => currentTarget.removeEventListener(event, hide));
             }
         };
 
diff --git a/components/lib/tooltip/tooltipoptions.d.ts b/components/lib/tooltip/tooltipoptions.d.ts
index 431252b9ad..a88d01eabf 100644
--- a/components/lib/tooltip/tooltipoptions.d.ts
+++ b/components/lib/tooltip/tooltipoptions.d.ts
@@ -2,7 +2,7 @@ import * as React from 'react';
 
 type TooltipPositionType = 'top' | 'bottom' | 'left' | 'right';
 
-type TooltipEventType = 'hover' | 'focus';
+type TooltipEventType = 'hover' | 'focus' | 'both';
 
 type TooltipAppendToType = 'self' | HTMLElement | undefined | null;
 
diff --git a/pages/tooltip/index.js b/pages/tooltip/index.js
index a1e9c14268..faa4fe6a52 100644
--- a/pages/tooltip/index.js
+++ b/pages/tooltip/index.js
@@ -1,14 +1,14 @@
+import getConfig from 'next/config';
+import Head from 'next/head';
 import React, { useState } from 'react';
-import { InputText } from '../../components/lib/inputtext/InputText';
+import { DocActions } from '../../components/doc/common/docactions';
+import TooltipDoc from '../../components/doc/tooltip';
+import { Badge } from '../../components/lib/badge/Badge';
 import { Button } from '../../components/lib/button/Button';
-import { Tooltip } from '../../components/lib/tooltip/Tooltip';
+import { InputText } from '../../components/lib/inputtext/InputText';
 import { Knob } from '../../components/lib/knob/Knob';
 import { Slider } from '../../components/lib/slider/Slider';
-import { Badge } from '../../components/lib/badge/Badge';
-import TooltipDoc from '../../components/doc/tooltip';
-import { DocActions } from '../../components/doc/common/docactions';
-import Head from 'next/head';
-import getConfig from 'next/config';
+import { Tooltip } from '../../components/lib/tooltip/Tooltip';
 
 const TooltipDemo = () => {
     const [saveBtnTooltipText, setSaveBtnTooltipText] = useState('Click to proceed');