hovering in pageblocktable

Question

I am trying to do hovering in pageBlockTable by using minipagelayout.

Now I was able to get hovering in few records where i do not scroll.But the problem comes with when I scroll the table and try to hover it.

instead of showing hovering page next to link,Its showing in relative position.

What should I do to get out from this problem.

The code that I used is

<apex:column  >
<apex:facet name="header">Account FirstName</apex:facet>
<a href="/{!acc.Id}"
id="{!acc.Id}"
position="relative"
onblur="LookupHoverDetail.getHover('{!acc.Id}').hide();"
onfocus="LookupHoverDetail.getHover('{!acc.Id}', '/{!acc.Id}/m?retURL=%2F{!acc.Id}&isAjaxRequest=1').show();"
onmouseout="LookupHoverDetail.getHover('{!acc.Id}').hide();"
onmouseover="LookupHoverDetail.getHover('{!acc.Id}', '/{!acc.Id}/m?retURL=%2F{!acc.Id}&isAjaxRequest=1').show();">
{!acc.Account_First_Nmae__c}
</a>
</apex:column>

regards, K.Arun

Answer 1

If the problem is that the mini page layout or whatever it is that you are trying to hover appears in the wrong spot it could be due to the same link being on the page more than once and the code using the same ID for both links. The hover will appear over the first one every time. See Mini Page Layout CSS in Visualforce Page for more information.

Answer 2

I figured out a workaround where you can explicitly make each id unique.

If you use a element you be able to make each id unique such that the hover float over that particular element.

<apex:variable var="uniqueNum" value="{!0}/>
<apex:repeat value="{!accList} var="acc">
<apex:variable var="accIdUnique" value="{!acc.Id}{!uniqueNum}"/>
<a href="/{!acc.Id}"
  id="{!accIdUnique}"
  onblur="LookupHoverDetail.getHover('{!accIdUnique}').hide();"
  onfocus="LookupHoverDetail.getHover('{!accIdUnique}', '/{!acc.Id}/m?retURL=%2F{!acc.Id}&isAjaxRequest=1').show();"
  onmouseout="LookupHoverDetail.getHover('{!accIdUnique}').hide();"
  onmouseover="LookupHoverDetail.getHover('{!accIdUnique}', '/{!acc.Id}/m?retURL=%2F{!acc.Id}&isAjaxRequest=1').show();">
{!acc.Name}
</a>


<apex:variable var="uniqueNum" value="{!uniqueNum + 1}/>
</apex:repeat>

As you can see the uniqueNum variable strings onto the id of the iterated account list making every row with the anchor tag unique and therefore you be able to hover across it.

Thanks. Regards, Joey Ho

Answer 3

This has been asked before, https://salesforce.stackexchange.com/a/18168/4123

It is a pretty fun debug though

On here are a couple of solutions they are all pretty much the same answer. Its down to a bug in SF