Display image filenames (Javascript help)

  Ben Avery 10:25 22 Jan 2004


I've posted a thread and closed it on a similar subject but not exactly the same. I'm sure this is a case of one or two lines of javascript added to my site but I don't know what it'd be and hope that you lot might!

I'm running a test area for what will eventually become an online wedding photo album. I've sourced most of the necessary code and have a fully funtional album which is what I was after.

The only thing is, I'd like to display either:

1) The image name (filename of displayed image) above the picture and have the page so that when youi click "Next" or "Previous" buttons, the filename changes to the current image


2) A simple up/down counter which I can modify so that in text above the image, each time "Next" or "Previous" is displayed the number changes to suit the image. For example when the first image is displayed the text above would read "Image 1 of 100" with the number "1" changing to "2" when I click next and back down to "1" if I then pressed the "Previous" button.

See the page here and let me know what you think click here

I really don't want the number/filename to be part of a form, i.e. in a box - just in text to match the site, like the "No of days remaining" format on my wedding page click here


  Ben Avery 10:29 22 Jan 2004

2) should read "each time "Next" or "Previous" is clicked, the number displayed above changes."


  Ben Avery 11:55 28 Jan 2004


  Crompty 13:32 28 Jan 2004

can be found here - click here

It might not have exactly what you're looking for but you should be able to change the code to suit your needs. Do a search for "slideshow" or something similar and adapt the source code of for your site.

Hope this helps! I might be needing this kind of thing soon - I got married last December and will probably set up a web page with photos!

  Crompty 13:39 28 Jan 2004

I think this slideshow would answer the first question, showing the filename of the displayed image - click here.

You'll have to play around with the code to get the filename above the image but that shouldn't be too much of a problem. Good Luck!


  Ben Avery 14:04 28 Jan 2004

That's the kind of thing I want, but being a total dunce with JavaScript I would'nt know what needs to be changed to fit my existing code.

You have any ideas on what I'd need to do with it? (I'd also like to add the First and Last buttons if possible - but that's not so important)


  Ben Avery 12:49 29 Jan 2004

I've added some script which (almost) does what I wanted. In it I have created a text box with no borders (cannot work out how to make white background transparant though yet - that'd be perfect!) and disabled it so it cannot be over-typed (not that it matters anyway)

The code required to do this was added to each of the functions as follows:

window.imageRef.value=viewPix[thisImage].substring(7,viewPix[thisImage].length-5) + viewPix[thisImage].substring(viewPix[thisImage].length-4,viewPix[thisImage].length)

The code for the texbox itself was is as follows:

<input type="text" name="imageRef" size="6" style="font-family: Verdana; border: 0" value="01.jpg" disabled>

The result of the two combined can be seen if you click here

If anyone knows how to change the background colour of the text box to transparent, please let me know!


This thread is now locked and can not be replied to.

Elsewhere on IDG sites

iMac Pro review

Illustrator of witty, relatable Instagram comics Julia Bernhard touches on our humble moments

iMac Pro review

Quelle est la meilleure application de podcast pour Android (2018) ?