Chage Theme image on mouse over

  • lahoti

    (@lahoti)


    16 years ago

    I want to change the header image onmouseover –
    Is some javascript method possible

    Presently have used this method to make it a link
    ———-header.php————-
    <div id=”header”>
    <div class=”headerimg_1″ onclick=”location.href=’https://abc&#8217;;” style=”cursor: pointer; “>
    </div>
    <div class=”headerimg_2″ onclick=”location.href=’https://xyz&#8217;;” style=”cursor: pointer; “>
    </div>
    </div>
    ——following in css———-
    .headerimg_1{
    height: 300px;
    width: 314px;
    background: url(images/1.gif);
    }

    #headerimg_2 {
    height: 300px;
    width: 222px;
    background: url(images/2.gif);
    }
    —————<<>>———–
    Also an unrelated doubt-
    if I do not give header image in css and inside the tag give <img…> – It won’t work. Why is it so?

    TIA

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter lahoti

    (@lahoti)

    it was <a...> <img...> </a>

    Thread Starter lahoti

    (@lahoti)

    Did it like this but still a issue
    (here i am using a:hover property to change the header image but when
    it is over link1 i want different image and diff for link2 – which am not able to achieve with this method… I can possibly achieve by cutting my header into 2 parts but if it can be done using only single header image will prefer that)
    changed css —–
    #header {
    background-color: #73a0c5;
    margin: auto;
    padding: 0;
    height: 300px;
    width: 960px;
    background: url(images/sky.gif)
    }

    #header a:hover{
    background-color: #73a0c5;
    margin: auto;
    padding: 0;
    height: 300px;
    width: 960px;
    background: url(images/3.gif)
    }
    #link1 {
    float: left;
    position:absolute;
    width : 314px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
    }

    #link2 {
    float: left;
    position:absolute;
    width : 222px;
    height: 300px;
    margin-left: 314px;
    margin-top: 0px;
    }

    php….

    <div id="header">
<a id="link1" href="https://as.com" title="Subscribe with RSS"></a>
<a id="link2" href="https://as.com" title="Subscribe with RSS"></a>

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Chage Theme image on mouse over’ is closed to new replies.