0
Groups of images
I have 4 groups of 4 images within each group. They are the same size. I want to group them one behind another, in each group separately, so the first image is on top, while others are behind and are not displayed untill i click on a specific group. When I click the specific group other image groups should dissapear. Anybody can help?
6 ответов
+ 1
You've tagged your question with 'positioning', but you can do that without ^^
You need a few lines of JS also ( you can try just with css, but it would be hard and tricky if only possible )...
So, if I good understand, you have a html structure as kind of:
<div id="g1"><img><img><img><img></div>
<div id="g2"><img><img><img><img></div>
<div id="g3"><img><img><img><img></div>
<div id="g4"><img><img><img><img></div>
With JS, set the attributes 'style.display' of the elements 'groups' ( g1-4 ) to 'none' to hidde and retrieve them from content ( so the place for the element being not reserved, not just invisible ), and reset to '' for displaying. So, next step is to attach an event listener to the ( g1-4 ) at the click event, and write the handler function to hide all group and display the one clcked ( target element of the event )...
+ 1
This is the opportunity to dive deeper into it :P
Try starting implementation a few by yourself, and post your attempt, so we can help you... without just do it for you: it's the best way to learn ;)
+ 1
Post yours, and I'll take a look ;)
0
i supposed it. But unfortunately i don't know to do that, i've already tried. By using SoloLearn app for javascript I've only learn how to count 5%2, what is the length of array [1,2,3,4,6,7] and that kind of things... no real knowledge in that...
0
man i am doing it for a two days and nothing, i am sick of it, believe me.. if you know how just post the code, please..
0
there's not my script, i've deleted it every time i saw it doesn't work. i supposed it wont work in the first place. there's no help here and it wont be.. i must re-study javascript, but in w3schools, this app is useless..