in

SharePoint Blogs

The Best Place for SharePoint-related Blogs

echef

From the cluttered (and clustered) brain of Josef Nielsen... A great place for Food, Friends, and... uh... SharePoint of course!

Image Changes on Hover

It sees there are a lot of large javascript samples out there to change an image source on mouse over, but they all seem overly complex.  Here's a little one I made recently for a project I was working on:

<script>
function imgHover(imgObj,imgSrc){
    imgObj.src=imgObj.getAttribute(imgSrc);
}
</script>

And here's some HTML to demonstrate how to use it:

<img
    src="
/PublishingImages/main.jpg"
    out="/PublishingImages/main.jpg"
    over="/PublishingImages/main_01.jpg"
    onmouseover="java-script:imgHover(this,'over');"
    onmouseout="java-script:imgHover(this,'out');"
    alt=""
    border=0
/>

Change the "java-script" and remove the "-" to make it work... It won't show up on the blog post otherwise (it tries to run it).  I've found it easiest to just embed the script in the master page, then I can use img tag with the extra attributes on any page in my site I want...

Comments

 

Daryl said:

Wouldn't you be better writing standard code that would validate? Or is this transformed after the .NET parser?

January 22, 2008 8:20 PM
 

Waldek Mastykarz said:

It's a pitty that your solution introduces invalid attributes and in-line JavaScript events. Using unobtrusive JavaScript and standard markup would be a great improvement.

January 23, 2008 1:16 AM
 

josef.nielsen said:

Good points... This was a quick and dirty fix that was never meant to rate high on the "good form" chart of javascripting, just get the job done.  Some of the other examples I've seen on the net just seemed too bulky and convoluted.  If you have some better example of image hover, please post them of post a link to them, as I'd love to learn of a better or simpler form :).  Thanx for the feedback.

January 23, 2008 7:26 AM

About josef.nielsen

I'm a long time computer nerd, living and loving technology wherever I can find it. I've recently shifted from a focus in MS SQL server, MSCS Clustering, and High Availability Engineering to focus on collaboration technologies, including SharePoint 2007. I recently moved from my long-time home in Seattle Washington to Salt Lake City.

Need SharePoint Training? Attend a SharePoint Bootcamp!

Posts (c) their respective authors. Everything else (c) 2007 SharePoint Experts