Old 10-08-2010, 20:05   #1 (permalink)
Senior Member
Join Date: Aug 2008
Posts: 118
onMouseOver help needed

I have a page where it lists a directory of companies, their respective products and an image. This image needs to change as the user hovers over the name of a product. For example, the image currently there is a banana. When the user hovers over the word apple, the image of the banana changes to the picture of an apple.

Right now I'm having issues replacing the "src" attribute. Here is my code:

<a onMouseOver="$('.test').attr('src', 'submit.png');">Fabric Expansion Joints</a>

I do have jQuery linked (Tech Reps Inc. | Home) but even when I use flat Javascript to turn the div's bg black it doesn't work. So the root of the problem is, I'm not getting onMouseOver to work correctly.

Some of you will think that writing a function outside of the <div>s directly would be a good solution but I propose that it isn't, considering there will be like 7 companies and they each offer like 6 items each.

If someone knows of a straight CSS solution...I'd be shocked. To the best of my knowledge, CSS classes can only affect the elements they are in, so that #FabricExpansionJoints:hover{} will not affect img.product{} in the least.

Thanks for any and all help. I'm looking for a very simple, streamlined solution to this problem. I know there are jQuery galleries that draw on this idea, but they are most likely overly complicated. Again, thanks for all the help.
  Reply With Quote
Old 10-08-2010, 20:20   #2 (permalink)
Senior Member
Join Date: Aug 2008
Posts: 118
Seriously? Kill me. Ok, here's the deal. I only included jQuery in the other page I use it in (to cut back on overhead). Therefore, it was not included.

Close this thread, burn it, whatever. Now I have that song "even the best fall down sometimes" stuck in my head regarding my situation!

Edit: Unless, of course, someone can lead me to a solution that is CSS only...
  Reply With Quote
Old 11-08-2010, 00:40   #3 (permalink)
Senior Member
siasan's Avatar
Join Date: Jun 2010
Location: Tasmania, Australia
Posts: 106
I'm pretty sure you could use CSS mouseovers combined with absolute positioning. I've inadvertantly made something like that when I was doing my maths wrong to set up CSS vertical navigation.
  Reply With Quote

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Thread Tools Search this Thread
Search this Thread:

Advanced Search

Contact Us - Web Design Forums - Archive
vBulletin © 2000-2009 Jelsoft Enterprises Limited.
Search Engine Optimization by vBSEO 3.0.0 RC8