-1

I'm new to the site, but I'm looking into creating a very simple code which from a small collection of images, changes the photo by clicking on the right hand side of the image for "next" and left side for "previous". Ideally allowing space underneath to include text and an option of an independent text link to change the image. Best way to describe what I'm searching for is something exactly the same as this http://rowingprojects.com/cabinet/florian-roithmayr-the-y

Can anyone help? I would very much appreciate it. Thank you.

Jonas
  • 121,568
  • 97
  • 310
  • 388
Timothy Holt
  • 1
  • 1
  • 1

1 Answers1

0

You need for this: HTML, CSS and Javascript.

In HTML: You put down all images which you want to slide, and give them an id. Hide all, in HTML code with style's display attribute. You need to add 2 transparent block which is always above the image left and right side. You can do this, with using CSS position, z-index, top, and left attributes. Give this elements onmouseclick and the correct JS function (nextimage, previousimage).

In JS: You need a var, which contains the actual picture number in the array. You need an array, with image ID's. You need a nextimage and previousimage, which show and hide the images with styile's display attribute, these using that array and var.

If you want a title or/and description for the image, you only need to put that image in a div and formating whatever you want. But in this case you need to add id to the div not to the image. Or you can change the title/description with using JS.

golddragon007
  • 1,247
  • 14
  • 27