1

Topic: ToolTips over New Member Images on HomePage

I have gotten a CSS tooltips function to work over an image on the site, so I now know it works.

Two questions:

1). How do I implement this over each new members image?
2). How to I populate the tooltip with some basic info: username, age, location, online?

Here's what's placed in my header.tpl

<a href="#" class="tt"><img src="http://www.mydomain.com/media/uploads/myimage.gif" border="0" />
<span class="tooltip"><span class="top"></span><span class="middle">My tooltip message.</span><span class="bottom"></span></span>

Here's what in my site.css

/*---------- bubble tooltip -----------*/
a.tt{
    position:relative;
    z-index:24;
    color:#3CA3FF;
    font-weight:bold;
    text-decoration:none;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #aaaaff; background:;}
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    top:0px; left:0;
    padding: 10px 0 0 0;
    width:200px;
    color: #666666;
    text-align: center;
    filter: alpha(opacity:90);
    KHTMLOpacity: 0.90;
    MozOpacity: 0.90;
    opacity: 0.90;
}
a.tt:hover span.top{
    display: block;
    padding: 30px 8px 0;
    background: url(bubble.gif) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
    display: block;
    padding: 0 8px;
    background: url(bubble_filler.gif) repeat bottom;
}
a.tt:hover span.bottom{
    display: block;
    padding:6px 8px 10px;
    color: #548912;
    background: url(bubble.gif) no-repeat bottom;
}

2

Re: ToolTips over New Member Images on HomePage

Boy, I can see no one liked this one. 26 views, 0 replies.

3

Re: ToolTips over New Member Images on HomePage

Since nobody answered me on this, I basically figured it out.

In case anyone cares: On the member_sections_picture.tpl, I added:

<a href="{top.virtual_path}{member_profile_link}" class="tt"><img src="{top.virtual_pic_path}{member_picture}" alt="" border="0" /><span class="tooltip"><span class="top"></span><span class="middle">{member_username}<BR><!-- IF member_online -->
<li class="status">{lang:"core","userinfo_online"}</li>
<!-- ENDIF --></span><span class="bottom"></span></span><br></a>

4

Re: ToolTips over New Member Images on HomePage

Well, I would love to care, and would have helped you, if I understood what all this is about...
What do you use this for, and how do it works?

5

Re: ToolTips over New Member Images on HomePage

When you rollover a person's profile picture a balloon pops up and says who they are and if they are online.

6

Re: ToolTips over New Member Images on HomePage

Ok, thank you smile

7

Re: ToolTips over New Member Images on HomePage

Tooltips would be nice for the registration page smile

8

Re: ToolTips over New Member Images on HomePage

hi chickc
i am one of them who just read your message without answering it. i didnt have the chance to give it a try yet but it will certainly be something interesting for me.

i'll have a closer look at it this weekend

thanks for your informations so far smile

9

Re: ToolTips over New Member Images on HomePage

You'll need this too: http://web-graphics.com/mtarchive/BubbleTooltips.html

10

Re: ToolTips over New Member Images on HomePage

Hi,

To get the Age, City and Country you need to put the following:
{profile_field_age_value_years}
{profile_field_city_value}
{profile_field_country_value}

Thanks,
G

11

Re: ToolTips over New Member Images on HomePage

I know this is an old post, but I couldn't find a more recent description of Tooltips. I have installed the code above, but can't get the bubble. All I get is grey text below the images that is hard to read. Can anyone help me with this? Thanks.

12

Re: ToolTips over New Member Images on HomePage

Go to vldCrowd. There is instructions on how to install the tool tip using the jquery that is part of vldPersonals.

13

Re: ToolTips over New Member Images on HomePage

Thanks, but that's what I downloaded. I will look at it all again. Maybe something will pop out. I don't feel like I understand the instructions very well.

14

Re: ToolTips over New Member Images on HomePage

Caciquer some knowledge in php, html, css is needed ...
to get success and understanding coding/changes on your site ...

15

Re: ToolTips over New Member Images on HomePage

I was a "webmaster" using html and some css. I am learning php as I go.

16

Re: ToolTips over New Member Images on HomePage

like me smile not so good at php only a beginner ... learning all the time ...

17

Re: ToolTips over New Member Images on HomePage

I guess where I got lost is here:
http://web-graphics.com/mtarchive/BubbleTooltips.html
http://web-graphics.com/mtarchive/001622.php
What in here do I need to grok?

18

Re: ToolTips over New Member Images on HomePage

I don't know what I am supposed to get from the links above. Can someone enlighten me, please?

19

Re: ToolTips over New Member Images on HomePage

the first link show you how it work and look at the code and you can see how it work ...
"view source"

20

Re: ToolTips over New Member Images on HomePage

It's not working. Now I have  "Enter correct email address please. We will send activation link to it."a linked to the Sign-up Username! I removed the tooltip code in header.tpl and account_register.tpl. Please, where is this coming from?

21

Re: ToolTips over New Member Images on HomePage

I'm a little lost with what the problem is.

These instructions don't help?

http://www.filipinalady.biz/viewtopic.php?f=104&t=293


If you made a backup before making changes, I would install backup and  start over. Follow the above instructions. It works for me like a champ.

Last edited by db3204 (2009-08-27 14:06:55)

22

Re: ToolTips over New Member Images on HomePage

Thanks db,
I appreciate your interest.
Actually, they did.
The positive thing is, I don't have the email message at username any more. On the other hand, nothing has a tooltip. Your instructions are very clear (although I missed the pointer.gif the on the first readthrough. I put it in root > media and templates > media. Nothing.
I checked each of the pages several times and uploaded them several times. Still nothing.
I did visit your sign-up page and clearly this works for you.

Here;s what I did in brief:
1. downloaded your folder
2. put the ext.hint.php in includes>ext
3. put pointer.gif in templates>mytemplate>media
4. added the code to includes>js>mist.js
5. added the calls in account_register.tpl
6. added my own hints to includes>languages>english>lang.lib.account_register.php
7. added the javascript to the bottom of account_register.tpl
8. added the css code to the bottom of site.css
Any suggestions anyone?

23

Re: ToolTips over New Member Images on HomePage

Other than refreshing your screen (press f5 a few times) I can't think of anything. It is easy to enter code wrong and it messes up the whole process. All I can suggest is to double check everything. Sometimes it is best to take a 24 hour break from doing the same thing and look at it again with fresh eyes.

Let us know if it works out.

24

Re: ToolTips over New Member Images on HomePage

chickc wrote

You'll need this too: http://web-graphics.com/mtarchive/BubbleTooltips.html

Sorry to bother you. I was looking in the forum for the exact same thing (the ability to see more info for a user in the main page by passing the mouse over his/her thumb). My problem is that I cannot fully understand how you made it in the end because I am trying but with no luck. If you could post some simple steps I would really apreciate it. Thanks.

25

Re: ToolTips over New Member Images on HomePage

It's regular feature of vldPersonals. I hope this can help you.
http://www.vldcrowd.com/member/1/blog/view/36/