Get a free trial // Grow your CSS skills // Land your dream job

jQuery background-image change on hover

  • # September 29, 2008 at 5:30 am

    Hi guys,

    I hope one of you jQuery genius’ can help me out on this. I’m trying to replicate the BBC style news items on their homepage. When you hover over a story title the accompanying image changes on the left hand side. I’ve created a test page using jQuery to run a function on hover that changes the background image of a div class.

    This is the link:

    It works when there is only one function and one command but as soon as you insert a second (or third) it won’t do anything! Ideally I’d like to tidy this up a bit by passing a variable to the function which defines the URL of the image but I wanted to get it working first!!

    This is the code for a single function and command (this one works):


    The page that is not working is the page above (

    Any help would be very much appreciated.

    Thanks in advance.

    # September 29, 2008 at 10:48 am

    I seem to have solved this using the mouseover attribute rather than hover. Are there any drawbacks to this approach?


Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed