JS document.image.void

[Verwijderd]

Ik heb een scriptje om een plaatje te wisselen aangevuld met een eigen bedenksel wat natuurlijk niet werkt.

de functie "changer" verwijst naar een mapje met genummerde jpg's (1.jpg, 2.jpg, 10.jpg, 11 etc..)

Ik wil hierop een aanvulling maken die checked of er een image is, zodat ik niet alle plaatjes moet hernoemen als ik er eentje tussenuit haal. Dus als in mijn map 2.jpg, 3.jpg en 5.jpg zitten moet hij snappen dat 4.jpg er niet is en naar 5.jpg gaan.

Ik had het als volgt bedacht (niet lachen):

var counter = 0
function changer(){
counter +=1
if(counter == 20){
counter=0
}
document.images[0].src="images/"+counter+".jpg"
}

if(document.images.src=void)
{
changer()
}

"void" zal wel niet bestaan, maar wat dan wel?

[Clay]

als die niet laadt geeft die een onerror event. helaas komt die pas na een momentje wachten, dus je kan er niet meteen een if achteraan gooien. wat misschien wel werkt is gewoon de image weghalen als die er niet is, ala:

code:

document.images[0].src = ...
document.images[0].onerror = imageLoadError;

...

function imageLoadError() {
   this.parentNode.removeChild(this);
}

document.images gebruiken is misschien een beetje onhandig, aangezien daar gewoon alle images van je document inzitten, maar dat is weer afhankelijk van hoe je html eruit ziet natuurlijk. Ik zou eerder voor een DOM methode gaan, bv:

code:

window.onload = function() {
   var image, container = document.getElementById('IDvanEenDivBV');
   for( ... i ... ) {
      image = document.createElement('img');
      image.setAttribute('src', 'images/' + ...);
      image.onerror = imageLoadError;

      container.appendChild(image);
   }
}

[Verwijderd]

Thanks Clay..
Ik heb je eerste script aldus verwerkt in het bestaande script in de head van de page:

code:

var counter = 0
function changer(){
    counter +=1
    if(counter == 5){
        counter=0
    }
    document.images[0].src="images/"+counter+".jpg"
    document.images[0].onerror = imageLoadError;
}

function imageLoadError() {
   this.parentNode.removeChild(this);
}

in de body:

code:

<a href="#" onClick="changer()"> <image src="images/0.jpg" border="0" name="picture"></a>

Ik heb van de 5 plaatjes de derde ertussen uit gesloopt maar daar stopt hij dan ook met een error. Moet hij na de remove niet weer naar changer() ?

[ Voor 12% gewijzigd door Verwijderd op 14-10-2004 12:04 ]

[André]

Verwijderd schreef op 14 oktober 2004 @ 12:03:

code:

var counter = 0
function changer(){
    counter +=1
    if(counter == 5){
        counter=0
    }
}

Wat doet dit stuk? 5 rondjes en klaar?

[Amras]

Verwijderd schreef op 14 oktober 2004 @ 12:03:
Thanks Clay..
Ik heb je eerste script aldus verwerkt in het bestaande script in de head van de page:

code:

var counter = 0
function changer(){
    counter +=1
    if(counter == 5){
        counter=0
    }
    document.images[0].src="images/"+counter+".jpg"
    document.images[0].onerror = imageLoadError;
}

function imageLoadError() {
   this.parentNode.removeChild(this);
}

in de body:

code:

<a href="#" onClick="changer()"> <image src="images/0.jpg" border="0" name="picture"></a>

Ik heb van de 5 plaatjes de derde ertussen uit gesloopt maar daar stopt hij dan ook met een error. Moet hij na de remove niet weer naar changer() ?

Je kan na:

JavaScript:

document.images[0].onerror = imageLoadError;

de functie zichzelf aan laten roepen? Moet je alleen wel even een stopvoorwaarde bedenken, nu zou ie voor altijd door blijven gaan.

[Verwijderd]

Thnks again,
Ik ga er later weer mee verder, moet ook nog ff uitvinden hoe men een stopvoorwaarde bakt.

André schreef op 14 oktober 2004 @ 12:06:
[...]

Wat doet dit stuk? 5 rondjes en klaar?

er zitten 5 plaatjes in de map die elk een nummer hebben (1.jpg, 2.jpg etc)

[Clay]

'k dacht meer aan een gallery, niet aan 1 klikbaar plaatje, sorry. Met 1 image moet er idd wel een check aan het einde, anders houdt het nooit op (maar die zit dus al in changer).

daar stopt hij dan ook met een error

Met 1 image moet die dus heel niet removen, dus dat kan je weghalen. Je zou meteen een changer(); in de error aan kunnen roepen.

[Verwijderd]

Hebbes!

code:

<html>
<head>
<title>Changing Images</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript">

<!--HIDE
var counter = 0
function changer(){
    counter +=1
    if(counter == 5){
        counter=0
    }
    document.images[0].src="images/"+counter+".jpg"
    
}




//STOP HIDING

</script>

</head>

<body>
<table width="100%">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td> <div align="center"><a href="#" onClick="changer()"> <image src="images/0.jpg" border="0" name="picture"></a> </div></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
<script type="text/javascript">
document.images[0].onerror = changer;
</script>

</body>
</html>

Clay:Blij dat ik voor dat ik de deur uitga je laatste reactie nog heb gelezen

[André]

Geef je img een ID ipv een name en roep hem zo aan (voor de netheid):

code:

document.getElementById("picture").src

ipv

document.images[0].src

[ Voor 201% gewijzigd door André op 14-10-2004 13:38 ]

[Verwijderd]

(eerdere post: JS document.image.void/)

In aan vulling op het eerdere script wil ik (met js?) een pagina maken waarin alle img uit een folder in een table worden geladen.

De plaatjes in de folder zijn allemaal genummerd; 0.jpg, 1.jpg, 2.jpg enz..

Ik dacht zelf om deze twee scripts te combineren:

code:

function insRow()
{
var x=document.getElementById('myTable').insertRow(2)
var y=x.insertCell(0)
var z=x.insertCell(1)
y.innerHTML="NEW CELL1"
z.innerHTML="NEW CELL2"
}

en:

code:

var counter = 0
function changer(){
    counter +=1

    document.images[0].src="images/"+counter+".jpg"
    
}

Het lukt me maar niet om een plaatje in een cell te definieren, zoiets als y.innerHTML="images/0.jpg"

Laat staan dat ik het tweede script kan itegreren in het eerste,

y.innerHTML="changer()"

Ik kan ook niets vinden over het specificeren van cellcontent (w3school JS dom)

PHP kan niet ivm planet. Het zou toch moeten kunnen met JS denk ik, omdat de changer de namen specificeert.

[ Voor 7% gewijzigd door Verwijderd op 17-10-2004 13:18 ]

[crisp]

innerHTML geeft al aan dat je dus HTML moet opgeven als cell-content:

JavaScript:

y.innerHTML='<img src="images/'+counter+'.jpg" alt="" />';

nog mooier is om het via de DOM te doen:

JavaScript:

var img = document.createElement('IMG');
img.src = 'images/'+counter+'.jpg';
y.appendChild(img);

[Verwijderd]

Het toeval wil dat ik het script al ontdekt heb:

code:

<html>
<head>
<script type="text/javascript">

var counter = 0
function changer(){
    counter +=1
    if(counter == 5){
        counter=0
    }
    document.images[0].src="images/"+counter+".jpg"
    
}


function insRow()
{
var x=document.getElementById('myTable').insertRow(0)
var y=x.insertCell(0)
y.innerHTML="[img]images/0.jpg>"
}
</script>
</head>

<body>
<table[/img]
  <tr> 
    <td>All Art</td>
  </tr>
</table>
<form>
<input type="button" onclick="insRow(),changer()" value="Insert Art">
</form>
</body>

</html>

Maar ik zal eens kijken of het mooier kan met als ik het dom doe. Thanks..

[Verwijderd]

Het script:

[rml][ JS] images folder in table[/rml]/

laad nieuwe cellen met images in een tabel. Hetzelfde script wordt toegepast in vier afzonderlijke kolommen, waarbij de changer in de ene kolom eerder rond is dan in de andere.

Ik krijg, waarschijnlijk hierdoor, een foutmelding "stack overflow @ line 0".

Ik denk dat ik de counter in het script moet laten stoppen ipv de resetfunctie counter=0
Ik kan hierover in de boeken niets vinden, { break} werkt niet...

(Verder lijkt het script prima te werken)

[ Voor 6% gewijzigd door Verwijderd op 18-10-2004 11:45 ]

[André]

Verwijderd schreef op 18 oktober 2004 @ 11:44:
Het script:

[rml][ JS] images folder in table[/rml]/

laad nieuwe cellen met images in een tabel. Hetzelfde script wordt toegepast in vier afzonderlijke kolommen, waarbij de changer in de ene kolom eerder rond is dan in de andere.

Ik krijg, waarschijnlijk hierdoor, een foutmelding "stack overflow @ line 0".

Ik denk dat ik de counter in het script moet laten stoppen ipv de resetfunctie counter=0
Ik kan hierover in de boeken niets vinden, { break} werkt niet...

(Verder lijkt het script prima te werken)

Je moet van die counter een local variabele maken ipv een global

[Pelle]

Ff je topics gemerged, het heeft geen zin om hier 3 verschillende topics voor te gebruiken.

[Verwijderd]

okidoki, thnks