Variabele achtergrond

Status
Niet open voor verdere reacties.
D

Doomic

Gebruiker
Lid geworden
30 jan 2007
Berichten
96
ik heb een site waar ik de achtergrond van een tabel steeds anders wil hebben.
dus niet de achtergrond van de site en ook niet een los plaatje.

ik heb al wel een code gevonden voor een variabel plaatje, maar niet voor een variabele achtergrond.

JS bestandje:
Code: 
<!-- 

function image() { 
}; 

image = new image(); 
number = 0; 

// imageArray 
image[number++] = "<img src='achtergrond/01.jpg' border='0'>" 
image[number++] = "<img src='achtergrond/02.jpg' border='0'>" 
// keep adding items here... 

increment = Math.floor(Math.random() * number); 

document.write(image[increment]); 

//-->

html bestandje:
Code: 
<html>
<head>
<title>Doomic: Home</title>
<SCRIPT LANGUAGE="Javascript" src="top.js">
</script>
</head>
<body leftmargin="0" topmargin="0" bgcolor="#000000">
<table align="center" height="250" width="781" border="0" cellspacing="0" cellpadding="0" background="...">

en de rest

nu laat die het plaatje wel zien omdat ik het JS bestandje "document.write(image[increment]); " staat.
maar wanneer ik dat weg haal moet ik het dus bij background ergens toevoegen zodat ik over het plaatje kan tikken. Hoe doe ik dat?

alvast bedankt
 
Zoek het indeze richting :

Code: 
document.body.style.backgroundImage = varFoto

varFoto is een variabele waarin de URL wordt geplaatst.
 
maar dat gaat over body achtergrond. en zou niet weten hoe je dan kunt instellen uit welke foto's het scriptje mag kiezen.

als er een kant en klare uitleg staat is het wel zo makkelijk, maar ik ben blijer met een reactie waar ik niet zo heel veel mee kan dan geen reactie.
dus wel bedankt
 
Probeer dit eens:
Vervang in je oorspronkelijke script de regel:
Code: 
document.write(image[increment]);
door die welke WinteE voorstelt, maar dan met gebruikmaken van de foto die al in je script gebruikt wordt:
Code: 
document.body.style.backgroundImage = image[increment];

Je foto's moet je dan wel als volgt toekennen:
Code: 
// imageArray 
image[number++] = 'achtergrond/01.jpg'
image[number++] = 'achtergrond/02.jpg'
 
Laatst bewerkt:
helaas, ik zie alleen maar minder dan voorheen.
voorheen zag ik namelijk nog een foto (alleen dan niet op de achtergrond) maar nu zie ik niks.
maar dit is alleen voor achtergrond als ik het goed begrijp, maar ik wil ook het plaatje als achtergrond van een tabel hebben.
 
Als je de afbeelding als tabelachtergrond wil moet je de tabel een id geven en die via het object aansturen.
Ik kan de code nu niet zomaar uit mijn mouw schudden; Het is ook niet iets dat je dagdagelijks gebruikt. Ik zal eens even rondneuzen en zal proberen een voorbeeldje uit te werken.
 
alvast bedank, ik ga ondertussen ook zoeken naar tabelen een id geven ed.
 
Bij deze een voorbeeldje:
Als je het javascript bekijkt zal je zien dat de tabel aan de hand van zijn id opgezocht wordt en een pointer bijgehouden wordt. Deze pointer wordt gebruikt om de style van het object (de tabel) aan te passen. In dit geval wordt de achtergrondafbeelding gewijzigd.
Telkens je de pagina vernieuwd wordt een willekeurige foto, uit een reeks vooraf geladen foto's, als achtergrond ingesteld. Je kan eventueel ook het onload event in de body tag gebruiken om de functie aan te roepen. Ik heb de aanroep nu gewoon achteraan in de body code gezet.
 

Bijlagen

um, dit is geen achtergrond plaatje maar een plaatje los onder je tabel... want als je in die test.htm wat schrijft in de tabel dan gaat het plaatje omlaag... wat wijst op het feit dat het geen achtergrond is....
wel bedankt voor het schrijven van een scriptje
 
owkee ik heb besloten om het niet meer als achtergrondplaatje te nemen maar gewoon als plaatje...
ik heb nogsteeds het oude js bestandje
Code: 
<!-- Begin Mouseover Code 

if (document.images) 
{
i0 = new Image 
i1 = new Image 

i0.src = 'img/achtergrond/submenu.bmp'
i1.src = 'img/achtergrond/submenu.jpg' 

} 
// Einde Mouseover Code-->


<!-- Begin Submenu Code
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
		if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
// Einde Submenu Code-->



<!-- Begin Variabele Afbeelding Code
function image() { 
}; 

image = new image(); 
number = 0; 

// imageArray 
image[number++] = "<img src='img/achtergrond/01.jpg'>"
image[number++] = "<img src='img/achtergrond/02.jpg'>"
image[number++] = "<img src='img/achtergrond/03.jpg'>"
// keep adding items here... 

increment = Math.floor(Math.random() * number); 

//BEinde Variabele Afbeelding Code-->

verder hier een gedeelte van mijn html code:
Code: 
<table border="0" cellpadding="0" cellspacing="0">
<tr><td width="781" height="258" style="background:url(img/achtergrond/kaderright.png) no-repeat right">
<img src="img/achtergrond/kaderup.png">
<script language=javascript>document.write(image[increment])</script>
<img src="img/achtergrond/kaderdown.png">
</td></tr></table>

zoals je kunt zien in de code heb je een afbeelding, daaronder een variabele afbeelding en daaronder weer een afbeelding.

nou is mijn probleem het volgende:
als ik mijn site met internetexplorer open dan laat de tussen die afbeeldingen een open ruimte zien (soort van cellspacing) maar als ik het met firefox open dan doet hij het wel netjes tegen elkaar zetten.

verderop in mijn bestandje heb ik een zelfde soort probleem met het submenu kijk daarvoor en voor het eerste probleem ff op www.doomic.nl/doomic dan begrijp je wat ik bedoel.
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan