change background image met javascript

Status
Niet open voor verdere reacties.

adisa

Gebruiker
Lid geworden
15 aug 2007
Berichten
14
Hallo allemaal,

graag wil ik mijn background image veranderen door op een hyperlink te klikken dmv javascript. Dit ipv een nieuwe hele pagina te moeten laden.
De code heb ik van http://programming.top54u.com/Samples/Javascript/Javascript-DOM/Change-Div-Background-Image/Default.aspx

Het enige is dat ze hier een button gebruiken en ik wil dit toepassen op een lege hyperlink die ik op de juiste plaats gepositioneerd heb.

Tot zover heb ik dit (maar het werkt niet):
HTML:
<script language="javascript" type="text/javascript">
    function changeDivImage()
    {
        var imgPath = new String();
        imgPath = document.getElementById("content").style.backgroundImage;
        
        if(imgPath == "url(../slices/sister_content.jpg)" || imgPath == "")
        {
            document.getElementById("content").style.backgroundImage = "url(../slices/sister_content.jpg)";
        }
        else
        {
            document.getElementById("content").style.backgroundImage = "url(../slices/sister_content2.jpg)";
        }
    }
    </script>

#content {
	height: 338px;
	width: 563px;
	background-image: url(../slices/sister_content.jpg);
	background-repeat: no-repeat;
	position: absolute;
	left: 110px;
	top: 100px;	
}
#prev {
	position: absolute;
	left: 25px;
	top: 242px;
	height: 25px;
	width: 140px;	
}
<div id="content">
<a id="prev" href="#" value="Change Background Image" onclick="changeDivImage()"></a></div>
Wie kan me verlichten?

Alvast bedankt!
 
Laatst bewerkt door een moderator:
Uhm, je geeft zelf de oplossing al!
ik wil dit toepassen op een lege hyperlink die ik op de juiste plaats gepositioneerd heb
HTML:
<a ...></a>
je ziet natuurlijk nu geen link, omdat er niets tussen de <a> en </a> staat. Zet er eens text tussen, en klik er dan eens op?!


:thumb:
 
Hai Vegras,

dat heb ik al geprobeerd. Maar dat werkt ook niet. Bovendien heb ik het ook met een button geprobeerd en dat werkt ook niet.
En met een lege hyperlink zou het moeten werken. De tekst zit in mijn background image vandaar dat ik een lege hyperlink heb gebruikt en die dan boven mijn tekst geposiotioneerd.
Die werkt goed. Dus daar ligt het niet aan....
Het gaat erom; op welke manier ik het ook doe hij wilt 'onClick' geen nieuwe afbeelding laden.

Maar iig bedankt.
Adisa
 
Als de link geen tekst bevat waar klik je dan op? Als ik er tekst tussen zet en er op klik werkt het bij mij wel.
 
Ik klik op de tekst in mijn back-ground image, de hyperlink heb ik hierboven geplaatst waardoor de link gewoon werkt.

Maar daar lag het niet aan.
Het is inmiddels opgelost dmv hulp van de site waar ik het vandaan heb.
Oplossing: omwisselen van de urls tussen the if/else condities!

In ieder geval bedankt voor het meedenken!

Adisa
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan