Plaatje ja achter Formulier veranderen.

  • Onderwerp starter Onderwerp starter rv94
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.
R

rv94

Gebruiker
Lid geworden
15 jan 2011
Berichten
306
Ik denk dat dit bij CSS hoort maar kan ook bij HTML.

Ik heb nu een formulier gemaakt. Nu wil ik alleen dat achter het formulier het plaatje veranderd. als je op een tekst klikt.
Het moet niet de echte achtergrond zijn. maar zoiets als dit. http://users.skynet.be/javascript/varia/rondehoeken2.htm maar dan met ene afbeelding. Dat lukt mij nog wel. Ik wil alleen dat die afbeelding achtergrond veranderd als je op een knop klikt. Ik hoop dat jullie mij snappen.

Alvast bedankt.
 
Hier heb ik even een snel voorbeeld gemaakt.
2uy6ans.png

Als je eerst op de tekst + rondje houd word hij al dat plaatje en als je er op klikt blijft hij het zelfde plaatje is dit mogelijk.
Ik hoop dat jullie het zo snappen.
 
Dus bij elke rondje wat je dient in te drukken, hoort een nieuwe achtergrond afbeelding?
Moet de derde dan altijd plaatje 3 zijn?
 
Ja gewoon elk bolletje een ander plaatje ik had het even bij 2 voor gedaan om het even duidelijk te maken wat ik zocht.

Als het zou kunnen zou het nog mooier zijn om als je hem er eerst ophouden en dan al het plaatje ziet en als je er op klikt blijft dat plaatje vast staan.
 
Ik had zelf even wat gezocht en geprobeert.
Ik wil niet de hele achtergrond.

Ik heb net even wat gezocht en heb dit gevonden. En iets aangepast.
Ik weet alleen niet hoe het in een deel komt dit is nu de hele achtergrond.

HTML: 
<head>
		<title>Test</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <script language="JavaScript">
var backColor = new Array(); 

backColor[0] = '#FF0000';

backColor[1] = '#00FF00';

backColor[2] = '#0000FF';

backColor[3] = '#FFFFFF';

function changeBG(whichColor){

document.bgColor = backColor[whichColor];

}

</script>

</head>
			
<body bgcolor="#FFFFFF">
<br>

<script language="JavaScript">

<!--

var backImage = new Array(); 

backImage[0] = "http://boeding.maakjestart.nl/images/auto.jpg";

backImage[1] = "http://img400.**************/img400/550/auto33jf.jpg";

backImage[2] = "http://img358.**************/img358/5876/auto58xq.jpg";

backImage[3] = "";


function changeBGImage(whichImage){

if (document.body){

document.body.background = backImage[whichImage];
} }
</script>

<script>

function selectCode(){

document.CodeForm.TheCode.focus();

document.CodeForm.TheCode.select();

}

function selectCode2(){

document.CodeForm2.TheCode2.focus();

document.CodeForm2.TheCode2.select();

}

</script>

                      
                      <p><input type="radio" name="aspect" id="3x2" onclick="javascript:changeBGImage(0)" onmouseover="javascript:changeBGImage(0)">Afbeelding 1</p>
					  <p><input type="radio" name="aspect" id="3x2" onclick="javascript:changeBGImage(1)" onmouseover="javascript:changeBGImage(1)">Afbeelding 2</p>
				      <p><input type="radio" name="aspect" id="3x2" onclick="javascript:changeBGImage(2)" onmouseover="javascript:changeBGImage(2)">Afbeelding 3</p>
					  <p><input type="radio" name="aspect" id="3x2" onclick="javascript:changeBGImage(3)" onmouseover="javascript:changeBGImage(3)">Afbeelding 4</p>


<script>



var beAsAnnoyingAsPossible = false;



function doPopUnder(){

if (document.all){

    popUnder=window.open("","","");

    popUnder.blur();

    popUnder.location=popURL;

    self.focus();}}



function munchTheCookie(Who){

   var brandOfCookie = Who + "=";

   var whatSayYe = "";

   if (document.cookie.length > 0) {

       beginningOfCookie = document.cookie.indexOf(brandOfCookie);

       if (beginningOfCookie != -1) {

           beginningOfCookie += brandOfCookie.length;

           endOfCookie = document.cookie.indexOf(";", beginningOfCookie);

           if (endOfCookie == -1) endOfCookie = document.cookie.length;

           whatSayYe=unescape(document.cookie.substring(beginningOfCookie, endOfCookie));

       }

    }

    return whatSayYe;

}



function ToPopOrNotToPopIsTheQuestion(){

   if (munchTheCookie('Nabisco')==''){

   doPopUnder();

   document.cookie="Nabisco=yes";}}



if (beAsAnnoyingAsPossible){

    doPopUnder();}

    else{ToPopOrNotToPopIsTheQuestion();}

</script>

</body>
	
</html>
 
Je kan een divje aanmaken waar de afbeelding in komt en dan de body, waar ik nu geloof dat de afbeelding geplaatst wordt, veranderen in dat divje
 
nou nu veranderd die wat in de body tag. het javascript, maar als je daar nou eens een divje van maakt in de body, daardoor veranderd je body achtergrond niet. Voor divjes zie w3cschool
 
Ja tussen die <div></Div> moet ik de tekst plaatsen.
Ik snap alleen niet hoe hij via mijn script in plaats van het in body te zoeken het in de div te zoeken.
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan