Random plaatjes

Door Jonathan op 23-09-2006 12:42

1.348 views

Dit is een geinige script waarbij er random 2 plaatjes op het scherm worden afgebeeld (1.jpg, 2.jpg, 3.jpg of 4.jpg) Met amount (nu op 4) kun je het aantal plaatjes aanpassen.

Er zijn echter 2 dingen die ik nog niet voor elkaar krijg:
(1) bordercolorlight en bordercolordark kan ik niet instellen. de border is nu zwart.
(2) er kunnen nu 2 dezelfde plaatjes op het scherm komen. eigenlijk moet plaatje 2 nooit hetzelfde zijn als plaatje 1.

<head>
<script type="text/javascript">
Amount = 4;
One = '<img src="';
Two = '.jpg" style="height: 220px; width:150px;" border=2>';
function printImage1() {
var r = Math.ceil(Math.random() *Amount);
document.write(One + r + Two);
}
function printImage2() {
var r = Math.ceil(Math.random() *Amount);
document.write(One + r + Two);
}
</script>
</head>

<body>

<script type="text/javascript"></script>
<br><br>
<script type="text/javascript"></script>

</body>

Rens nvt

23-09-2006 13:32

Het is misschien handiger om dit anders aan te pakken... Namelijk door de pagina op te maken, en na het laden van de pagina pas de plaatjes in te voegen (dus niet met document.write)

Zie hieronder voor het scriptje

<?php
<html>
<head>
<script type='text/javascript'>
var amount = 4;
var one = 0;
var two = 0;

function printImages () {
while (one == 0) {
one = Math.ceil(Math.random() * amount);
}
while (two == 0 || two == one) {
two = Math.ceil(Math.random() * amount);
}
document.getElementById('img1').src = one + '.jpg';
document.getElementById('img2').src = two + '.jpg';
}
</script>
<style type='text/css'>
img#img1, img#img2 {
border-style: solid;
border-width: 1px;
border-color: #cccccc;
heigth: 220px;
width: 150px;
}
</style>
</head>
<body onload="printImages()">
<img id='img1'>
<img id='img2'>
</body>
</html>
?>

PHP Newbie

23-09-2006 13:50

Persoonlijk zou ik dit met php doen, aangezien hier niet per sé javascript voor nodig is. En bezoekers waar javascript uitgeschakeld staat dus ook gewoon willekeurige plaatjes zien

Jonathan

23-09-2006 13:59

Dat is een zeer clever scriptje, dank je wel. Het enige dat voor mij beter werkt is om de hoogte, breedte later in te stellen:

<img id='img1' height=220 width=150>

Het is alleen jammer dat javascript niet met php 'communiceert' anders had ik het plaatje direct kunnen koppelen aan de variabele en zo een link maken met dat id. Tenzij je natuurlijk weer een link kunt maken in javascript en een idnummer mee kan geven.

Zou dat - hardop denkend - op deze manier kunnen in javascript?

<a href="message.php?id=' . $_GET['one'] . '"><img id='img1'></a>

<a href="message.php?id=' . $_GET['two'] . '"><img id='img2'></a>

PHP Newbie

23-09-2006 14:02

jah, dat kan wel als het goed is.

Reageren

Inloggen om te reageren