+ Start a Discussion

Displaying pop-up summaries on hover

Well this is easy in standard salesforce, mostly because it happens automatically.


What I want to do is make a summary popup window when a user hovers over a link in a visualforce page. Something like this (taken from standard salesforce):




There doesn't seem to be any standard or easy way to do this in visualforce. Is there? I'd like to avoid rewriting standard salesforce functionality if at all possible.


Anybody know how to do something like that? Also, what's the proper salesforce terminology for these popup windows?






Not sure of the salesforce terminology, but elsewhere they can be called tooltips, popup bubbles and popups(I'm sure there's many more names). To emulate this behaviour you'd have to use javascript, and I'd suggest using jQuery. Now I know what you're thinking, "I don't wanna learn no stinking jQuery, I want results gosh darn it!", but hear me out.


jQuery is massively supported and quite simple to use. To illustrate here's a tut to give you the gist. Look's like quite a fun one to implement too. Goodluck.



Message Edited by weznolte on 10-21-2009 11:40 AM

<apex:inputField value="{!account.name}"/>


it will show pop-up automatically





I am having the same problem. Have you sort this out?







Nope, and after digging into the javascript salesforce uses to generate them I'm sure it's an unstable API, that is I can't just call the onHover javascriptn they use for them without it breaking every release or two.


I think the only real solution is Wes', which ignores the mini layout, but it seems like the only viable option.

Chamil MadusankaChamil Madusanka



Try this example




chamil's blog


If a reply to a post answers your question or resolves your problem, please mark it as the solution to the post so that others may benefit.

Himanshu ParasharHimanshu Parashar

thank you very much for your post. it work like a charm


How did you added more fields to popup?

Chamil MadusankaChamil Madusanka

You can add more fields from mini pagelayout of particular object


The question is: how to remove required fiels from this popup? We have a custom contract status, and I need to hide the original status from this summary popup. Otherwise I would need to create a custom contract object.