adding tooltip to cat img on main page

ok, what i want to do is a little complicated, but it seems doable.

for reference site is here: nonniescollectables.com

1.38a

the cat images that are on the front page, i want to add a tool tip so that when you mouse over the image a description will pop up with a b that i create.

i realize that this will need to be javascript, i can probably find a script that does this, but what i need to know from all of you wonderful zenners is:

where do i add the js to the image? i looked in tpl_main_page.php

i thought i would find an if statement and then the image and cat name somewhere, but no where to be found. so for the cat images that are showing up on the main page, what file are they coming from?

second, i need to know what the function is to call the description itself, so that after i get the js in the js folder, and get it to be called from the file (that i cant find lol) how do i call the description.

if you guys can tell me that i should be able to figure it out and add i nice contrib.

ok, so for an update i just found the file i need to edit, includes/modules/category_row.php

i just need to figure out how to call the desc

im assumin this is what i need to edit

    $list_box_contents[$row][$col] = array('params' => 'class="categoryListBoxContents"' . ' ' . 'style="width:' . $col_width . '%;"',
                                           'text' => '<a href="' . zen_href_link(FILENAME_DEFAULT, $cPath_new) . '">' . zen_image(DIR_WS_IMAGES . $categories->fields['categories_image'], $categories->fields['categories_name'], SUBCATEGORY_IMAGE_WIDTH, SUBCATEGORY_IMAGE_HEIGHT) . '<br />' . $categories->fields['categories_name'] . '</a>');

but i cannt fiure out what to put where for the desc

The site you referenced is using the default "title" attribute within an "a href" tag to show the mouse over text. Although what you want to do is probably doable, it may not be all that easy.

Do you have a better example of what you want to do?

in /includes/templates/template_default/templates/tpl_index_product_list.php

i found ```

THIS IS WHAT CALLS THE DESC ON THE CAT LISTING PAGE, BUT BECAUSE IT IS AN ECHO I CANT GET IT TO WORK

I HAVE TRIED WITH THE ECHO, I HAVE TRIED

. $current_categories_description .

AMONG OTHERS, DOES ANYONE KNOW HOW TO FORMAT THIS RIGHT?

i found a js script to do this, and here is the code i need to merge with the anchor

onmouseover="Tip('Some text')" onmouseout="UnTip()"

i have tried just about everythin with this too, so im going to sleep before i post 50 more messages, and i will check in the mornin, someboody help please!

and where it says some text i need to put the call for the desc

so basically i just need this: formatted the right way

'<a href="' . zen_href_link(FILENAME_DEFAULT, $cPath_new) . '"  onmouseover="Tip('DESCRIPTION CALL HERE!')" onmouseout="UnTip()" >' . zen_image(DIR_WS_IMAGES . $categories->fields['categories_image'], $categories->fields['categories_name'], SUBCATEGORY_IMAGE_WIDTH, SUBCATEGORY_IMAGE_HEIGHT) . '<br />' . $categories->fields['categories_name'] . '</a>'  );

Website Rob:

The site you referenced is using the default "title" attribute within an "a href" tag to show the mouse over text. Although what you want to do is probably doable, it may not be all that easy.

Do you have a better example of what you want to do?

sorry i didnt even see your post, i know thats just the title attribute, and if i could get that to work as the des it would be fine. what i want it to do, is when i hover over the image, i want a bubble, BG i can create in photoshop to come up with the description text. i think ive nailed it down except the formatting of the href

am i going about this the right way?

That's a good question. :smile:

Mouseover popups can be done with; CSS, DHTML or jQuery. If you want to use a BG image then you are looking at using jQuery and for how you want to do it, may not be easy. Cannot give specifics off the top of head though.

thnk you, i might just do it the easier way, take the cats off the main page, and do it manually with httml in define pges edito to get it to work properly. thank you once agin