jQuery justFlipIt plugin z-index isn't working

It works! I know you outlined your thought process in your earlier post, but I just want to make sure I understand the code:

  1. You’re starting variable ‘zIndex’ at 1
  2. When class ‘card’ is clicked, the variable ‘card’ becomes whatever was clicked and has the class ‘_justFlipIt_panel’
    2.1 If $card has class ‘flipY’, set $card’s z-index to 0 and return that value. // makes sure that all cards are starting at the same value
  3. The variable cardDepth gains either the z-index of the $card that was clicked, or the value 0 // shouldn’t they all be 0?
    3.1 If cardDepth doesn’t equal variable zIndex (i.e. 1), add 1 to the z-index of that $card

Am I understanding it correctly?

Well, what you’ve described is what each line of code does and it’s mostly correct. However, the big picture is finding what kind of property an algorithm tries to maintains.

For example, for this algorithm:

  • Cards in ‘front’ state has z-index 0
  • Cards in ‘back’ state has minimum z-index of 1.
  • No cards in ‘back’ state share the same z-index.
  • The last card turned to ‘back’ state gets the most z-index.

This makes the following possible:

  • cards in ‘front’ state is always behind the cards in ‘back’ state.
  • if multiple cards are sequentially turned to ‘back’, the last one will be at the top.

So, as soon as some card is turned to ‘front’ there is no further evaluation other than setting their z-index to 0. There is no return value. The return statement is only for early termination of the algorithm.

You can remove this check cardDepth !== zIndex. It was only there for my previous experiment.

Oh ok, I see. Thank you so much for your help!