Jump to content

Random Image Generator - Code Question

Recommended Posts

Site URL: http://www.imaginarybeast.com

I'm trying to add a fun / quirky feature to my site, but I'm not sure what to call it or how to look it up. I'd like to have people click one image, and a randomized image (maybe out of 10 options?) pops up when it's clicked. 

Specifically, I want to make an 8 Ball and have the answer revealed when it's clicked. OR you could think of it as a fortune cookie-- click it and you get your random 1-of-10 fortune. 

I'd really appreciate any help, direction, or thoughts 🙂


Link to comment
  • Replies 1
  • Views 550
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Here is an example. No code. Just the result.


For this effect and another I saw online the basic effect is to click, get a random number, then update a text element. The text is placed in the middle of a picture.

You could do this effect with updating text like above or swapping images instead. For image swapping you'd might have a wrapper image and just update the center. Or you could even just swap the whole image.

I suggest you design/decide on the overall look you want to achieve and then figure out how to animate it.

You might do a search for magic 8 ball codepen

That would show ways folks have a similar effect.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.