Member Avatar for Michelle.Amethyst

Hi
I am currently studying to become a primary school teacher and have an assessment to create an interactive webpage. Now as it is to be interactive I would like to make it so when the student clicks on the image, it becomes another image, I do not want a marquee, but more like a slideshow without the play option, or next arrows showing, is it possible and if so can someone please help me with the coding?
I am creating it with Wix due to its simple to use layout, as this is due on the 21st October, and I have many other assesments hanging over my head as well.

Thanks :)

  • 3 Contributors
  • 6 Replies
  • 238 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by EvolutionFallen
Member Avatar for Michelle.Amethyst

ok I think I have found what I want to some degree BUT I need to figure out how to add a 3rd image

<!DOCTYPE html>
<html>
<body>
<script>
function changeImage()
{
element=document.getElementById('myimage')
if (element.src.match("http://i1255.photobucket.com/albums/hh638/BoredAmethyst/01_06_13_prev_zps02f525de.jpg"))
  {
  element.src="http://i1255.photobucket.com/albums/hh638/BoredAmethyst/09_04_13_prev_zpsddbbd58c.jpg";
  }
else
  {
  element.src="http://i1255.photobucket.com/albums/hh638/BoredAmethyst/01_06_13_prev_zps02f525de.jpg";
  }
}
</script>
<img id="myimage" onclick="changeImage()" border="0" src="http://i1255.photobucket.com/albums/hh638/BoredAmethyst/09_04_13_prev_zpsddbbd58c.jpg" width="180" height="120">
<p>Click to view the life cycle</p>

</body>
</html>
Edited by Michelle.Amethyst because: mistake at end of code
Member Avatar for EvolutionFallen

Well, this is far from the best way to go about this, but for the sake of not throwing new code at you and keeping what you already have, let's try this. Note I'm editing line 8-15 above (not line 16, leave that there):

if (element.src.match("http://i1255.photobucket.com/albums/hh638/BoredAmethyst/01_06_13_prev_zps02f525de.jpg"))
{
    element.src="http://i1255.photobucket.com/albums/hh638/BoredAmethyst/09_04_13_prev_zpsddbbd58c.jpg";
}
else if(element.src.match("http://i1255.photobucket.com/albums/hh638/BoredAmethyst/09_04_13_prev_zpsddbbd58c.jpg"))
{
    element.src="[URL for your 3rd img]";
}
else
{
    element.src="http://i1255.photobucket.com/albums/hh638/BoredAmethyst/01_06_13_prev_zps02f525de.jpg";
}
Member Avatar for Michelle.Amethyst

thanks

been a busy week, been learning how to use adobe flash to insert interactive components, only to discover wix does not accept action script 2, (so now having to try and figure out how to do it all in action script 3, good thing I am stubborn) so only just remembered to check here, will give it a try in a second.

Again, thank you so much, my skills are limited and this stupid unit from the uni does not teach how to do these things at all, it is more about how to make things match the curriculum and the diverse learning styles, yet 40% of my grade will come from how well I do with this webpage

Member Avatar for Michelle.Amethyst

yes it worked...thank you so much, now I feel like I can finally move forward with this thing, not being able to work that out really put a spanner in the works, now i can add something new to this assignment, the first thing I have added in the last days that I will be happy with :)

Member Avatar for otengkwaku

@evollutionfalling; can you use arrys to make the jod esaly

Member Avatar for EvolutionFallen

@Michelle.Amethyst: You're welcome, glad to help! Please mark the thread as solved if you have no further questions.
@otengkwaku: Absolutely! I would much prefer that, but didn't want to complicate things here with new terminology and concepts.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.