dynamisk baggrundbillede

nu kender jeg stort set intet til javascript, men jeg prøver alligevel at lave et script til en menu, det går også meget godt, men nu har jeg brug for hjælp :)

Scriptet skal virke på den måde at når man bevæger musen over et link fremkommer et layer som har et billede som baggrund.
se koden herunder:

<div id="layer" style="visibility: hidden; position: absolute; left: 472px; top: 95px;     width: 450px; height: 40px; background-image: url(gfx/<?=$skin?>/transp.gif); background-repeat: no-repeat;"></div>

For at gøre layeret synligt gør jeg fx sådan her:

function () {

    layer.style.visibility=visible;

}

men når jeg prøver at lave samme trik med 'background-image' fejler det. hvis det er fordi jeg gør det forkert ved jeg ikke.

NB! baggrundsbillede skal variere alt efter hvilket link man holder over, så jeg havde tænkt på noget i følgende stil:

// bg_pic indeholder nu pic.gif
function (bg_pic) {

    layer.style.visibility = visible;
    layer.style.background-image = HER_SKAL_SÅ_STÅ_ET_ELLER_ANDET;

}