Jquery add.class

JavaScript
#1

Hi,

I’m learning/trying out JQuery, I’m playing with a fiddle to get the basics wrapped around my head.

This fiddle removes a class to show an image.
My goal is to show an image - remove the same image and show a second image over time.

I thought if I just add an extra if statement that add’s the class hidden the first image goes away again. And I can focus on how to add a second image to the code.

Fiddle

#2

Hi @quintendewilde ,
I see in your code your taking the long approach. For another developer will be good to have a better understanding and easy to read the code.

  1. You can start by creating a function of images.
  2. In that function of images you can create an array of images.
  3. In order for you to show an image over time will be good to create a random image generator that way you know its removing images, and adding a new one.
  4. Display the result.
  5. Call the function images.
  6. Create a callback setTimeout function and call the function images with the specific time that you want to generate to remove each image.

I suggest read carefully on how to start, and then ask the forum for questions on how to proceed.

#3
  1. You can start by creating a function called GenerateImg
function generateImg(){
 // create your two images  variables 
   ...
// add them two an array called imageArr
var imageArr = [image1, image2];
// Generate a random number with the method Math.random
// you can make a research if you dont know or ask.
};
  1. Set a callback function to execute the function every 3 sec to change the
    image instead of delete or remove each image.
// Set a callback function to execute the function every 3 sec.
setInterval(function() {
     // call the function generateImg(),  it executes every 2 sec
  },2000);
1 Like