Tag Archives: Help Text

Display Standard Salesforce Help Text on Visualforce Page

<apex:page>
    <style>
        .vfHelpText a            {position:relative;}
        .vfHelpText a span       {display: none;}
        .vfHelpText a:hover span {display: block;
        position:absolute;
        top:1.25em;
        padding:2px 5px;
        left:-15em; width:15em;
        z-index:100;
        border:1px solid orange;
        background-color:#FEFDB9;
        color:black;
        }
        .helpOrb {
        background-image: url(/img/help/helpOrbs.gif);
        background-position: 0 0;
        width: 20px;
        height: 15px;
        }
        .helpButtonon .helpOrb {
        background-position: top right;
        }
        .helpButton .helpOrb {
        background-position: top left;
        }
    </style>
    
    <span class="vfHelpText">
        <apex:outputLink value="javascript:return false;">
            <img src="/s.gif" alt="" class="helpOrb" />
            <!--s.gif image is standard image no need to upload anywhere-->
            <span>{!$ObjectType.Contact.fields.AccountId.inlineHelpText}</span>
        </apex:outputLink>
    </span>
</apex:page>