Skip to content

All topics  /  React

React JS Bootstrap Tooltip Example

React

Apr 23, 2020

Hello Dev,

In react project many time required button description. tooltip is reacr bootstrap component you can use simply. this is best tooltip example for react js. you can also set tooltip position like top,bottom,left,right. how to write description about button in react js then use react bootstrap tooltip.

import React from 'react'
import { OverlayTrigger,Button,Tooltip } from 'react-bootstrap'
class BootstrapTooltip extends React.Component{
    render(){
        return(
            <div>
                <OverlayTrigger
                    placement="right"
                    delay={{ show: 250, hide: 400 }}
                    overlay={
                        <Tooltip id="button-tooltip">
                            Nicesnippets.com tooltip
                        </Tooltip>
                    }
                >
                    <Button variant="success">Hover me to see Tooltip</Button>
                </OverlayTrigger>
            </div>
        )  
    }
}
export default BootstrapTooltip;