Click here to Skip to main content
14,486,715 members
Rate this:
Please Sign up or sign in to vote.
i got a few question about a game I'm trying to build, fiddle is included.

I'm trying to position the images atop one another, and then to resize them all to make them all the height and width of the table (as i made the table cells, they are responsive), and to position them atop the table,my wish is that's only 1 image is visible (my guess the other 2 are at display none?) ,with a 0.4 opacity, is not clickable because of z-index=-1 or a java-script function. i have no idea how to accomplish this, tried looking around here didn't get far, am very new to CSS.

in addition i've added an image to the button with the class backUp its a flexbox , with items growing according to the number i gave, how do i make the image resize and take up the space it should? currently it just messes up the entire page in addition i've also added an image to the div


upon a certain condition ,i want to show one of the 2 other faces, and make them clickable, so when clicked I'm guessing the z-index will change and the opacity as-well to make it not override the table but act as a background image that's clickable. for example:

if(isVictory) {"none"""

would that work or is there some other parameter i need to know about?

3. any better way to resize the TD's? it jitters every time i change the size

Currently I'm unable to even resize the images correctly, tried playing with positions didn't help much The JavaScript function responsible for resizing is present too, it works well for the TD's but not for the images

The Fiddle:[^]

What I have tried:

tried playing with positions in css, but since i dont understand it that much the outcome has been bad
gggustafson 20-Mar-20 12:35pm
I visited your jsFiddle site. There is a lot missing that is needed to help you. for example none of your external JavaScript files are included; I don't know what your event handlers do; etc. Have you tried developer mode (F12) to step through your application?

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100