Skip to content

mikexwolf/heros-mike

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Superhero Gallery

A superhero gallery that displays a new hero with each button click, infinitely cycling forever.

Using only jQuery:

  • When the page opens, show only the first character in the list.
  • Set the h1.name to the text for the first superher
  • Setup a listener on the button.next
  • Keep track of which one is visible so you know which is next
  • Show the next element on each click of "next"
  • Update the h1.name for each new hero
  • When you hit the :last-child then click "next", go back to the :first-child
  • Try animating the name to fade out and slide upwards on each click
  • Now that you're able to go forward, try to make it go the other way (prev)
    • Spend the rest of your time trying to refine this and make it more efficient