• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Hover text in XF-like CSS Blockquotes

Moses

Well-known member
#1
I'm attempting to put some descriptive alternate text for images on my new theme and thought it would look pretty cool to have them come out like the forum description hover that XF uses on forumhome.

My plan was to have a team logo showing on this page and when someone mouses over the div containing the image it'll show those cool XF style hover blocks saying "Proudly supporting the Wallabies" or somesuch.

Problem is, it's quite complicated and I'm struggling!
Any help would be appreciated
 
F

Floris

Guest
#2
Try: class="NoOverlay Tooltip" title="My text here" in the <img /> ? (if it's a link, probably need to apply to <a>
 

Moses

Well-known member
#3
Thanks for the quick response Floris, I tried changing my code to:

<div class="profimg {$message.customFields.international_rugby_team}">
<div class="NoOverlay Tooltip" title="Proudly supporting the {$message.customFields.international_rugby_team}"></div>
</div>
But no such luck
 

Moses

Well-known member
#5
Cheers Robbo, I still see nothing when hovering over the div... in fact when looking in Firebug the title tag is stripped too?

<div class="profimg {$message.customFields.international_rugby_team}">
<div class="Tooltip" title="Proudly supporting the {$message.customFields.international_rugby_team}"></div>
</div>
 

Robbo

Well-known member
#6
It being stripped means it is being initialized properly. Are you sure you are hovering over the div? Give it "test" as the inner HTML and hover it and see what happens.
 

Robbo

Well-known member
#9
I don't know what the key is. Do {xen:helper dump, $message.customFields.internation_rugby_team} to find out. I think there might actually be something else like $customFieldData... I can't remember right now...