Grow your CSS skills. Land your dream job.

image mouseover, replace div text

  • # March 11, 2010 at 7:54 pm

    I am trying to change a div content via mouseover some images. I thought this might do it but no luck. I would like to mouse over the image with an ID of img1, img2 and img3 then have the div below replace the text with the var text.

    Code:
    var $img1 = ‘

    From the outset, Bla Bla Bla one.

    ‘;
    var $img2 = ‘

    From the outset, Bla Bla Bla two.

    ‘;
    var $img3 = ‘

    From the outset, Bla Bla Bla three.

    ‘;

    $(function() {
    var $cb = $(“.mark_container”);
    $cb.mouseover(function() {
    $cb.removeClass(“active-mark”);
    $(this).addClass(“active-mark”);
    var $picTxt = $(this).find(“img”).attr(“id”);
    $(‘#mark_txt’).html(”).html($picTxt); < ------------------ Problem
    }).mouseout(function() {
    $cb.removeClass("active-mark");
    $(this).addClass("mark_container");
    $('#mark_txt').html('').html($defaultTxt); <------------------ Problem
    });
    })

    Code:
    here is my html

    temperature
    inventory
    quick

    From the outset, Default text

# March 12, 2010 at 3:45 am

I got this to work with your html code.

Code:
# March 12, 2010 at 7:08 pm

Thanks jamy_za, I had it that way at first but was looking to create an function.

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".