change back gound image

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • ravindarjobs
    New Member
    • May 2007
    • 86

    change back gound image

    Hello friends,

    i have a page with a div tag and a div class(i dont know the perfect terminology ofcourse)


    i have two boxes in the page. In the first page i have few anchor links.
    My requirement is if i place mouse pointer on one of the links in the first box then the background image of the second box must be changed.

    How do i acheive it?



    Here is my code


    Code:

    [HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <style>
    #left {
    width:702px;
    height:370px;

    border:1px;
    margin:0px 0px 0px 170px
    }
    .leftbox {
    width:300px;
    height:400px;
    padding:5px;
    border:1px solid #720B0C;
    float:left;


    }
    .rightbox {
    width:300px;
    height:400px;
    padding:5px;
    border:1px solid #720B0C;
    float:left;
    background: url(images/bg.jpg)

    }
    </style>

    </head>
    <body bgcolor=#F7EDD8 >


    <div id="left">

    <div class="leftbox" >
    <A HREF="http:\\ww w.yahoo.com"> 1. ABC</a><br><br>
    <A HREF="http:\\ww w.yahoo.com"> 2. 123</a><br><br>
    <A HREF="http:\\ww w.yahoo.com"> 3. XYZ</a><br><br>

    </div>
    <div class="rightbox "><p>right</p></div>
    </div>
    </body>
    </html>[/HTML]


    Thank you
    Last edited by acoder; Dec 23 '07, 08:18 PM. Reason: Added code tags
  • acoder
    Recognized Expert MVP
    • Nov 2006
    • 16032

    #2
    Add the onmouseover to the links either inline <a ... onmouseover=... > or in script tags:[code=javascript]var links = document.getEle mentsByTagName( "a");
    for (i = 0; i < links.length; i++) {
    links[i].onmouseover = ...
    }[/code]To change the background image, use the style.backgroun dImage property - see link.

    Please use code tags when posting code.

    Comment

    Working...