tAndreii• 40
@tAndreii
Submitted
This solution is only the first try, so it expands only the first answer and doesn't have a background-pattern. With the help of solutions on the site I'll figure out how to improve my solution and I'll upload it
serdarakova
@Serdarq1
All comments
- serdarakova• 260
@Serdarq1
Posted
Hi, I checked your script and the error happens because of usage of the querySelector. querySelector selects only the first child of multiple tags. There are multiple things you can do to improve your solution. Firstly, you can use querySelectorAll and then use forEach to loop every single item however if you are new to javascript I would not recommend it. Secondly, instead of using onClick on html page you can create event listener(questionContainer.addEventListener("click", () => {})) and you can loop every single item with forEach or you can name every container's class something different and add event listener to all. If you get stuck at somewhere you can ask again. Hope you find this helpful
Marked as helpful
0 - MisterCcobD• 120
@MisterCcobD
Submitted
I tried with JS but, run into problems when doing two functions for each clickable element
serdarakova• 260@Serdarq1
Posted
Hi, what kind of problems you ran into? If you tell me I can do my best to help you out.
0 - Jonathan Betancur• 90
@Jonathanbees
Submitted
The most difficult part of creating this project is to align each image with each text, like the titles, another difficult thing that happened (i spend some hours of that) is to build the accordion with each change of the image when it is clicked, in this code, i let the attempts with a little function that i tried, but then i discard it
I enjoy (and also suffer) this but at least i learned a lot
Any comment that will help me to improve is very welcome, thanks :3
serdarakova• 260@Serdarq1
Posted
hi your project looks very good and i can give a few advice firstly i wouldnt recommend using inline-css(css inside a html tag element) nor internal(css in the head section) you should create a file just for css and then link it on your html file and the same goes for javascript
also using display:flex will buy you so much time and also make your work so much easier for you and lastly
i saw you wrote "item.querySelector('img')" this variable multiple times if you have a variable that you will use multiple times it would be so much better if you just define it once( const plusIcon = document.querySelector('img')) and use it as a defined version this will make your code look more readable easy to find bugs and also much cleaner
hope that helps
Marked as helpful
0 - badrEladraoui1• 90
@badrEladraoui1
Submitted
I need your feedback i tried to add a transition to the paragraphs while being shown but I couldn't, and for the background, I don't know how to achieve it like the challenge wanted it to be ...
serdarakova• 260@Serdarq1
Posted
For background you can add two different divs one for the top section and other for the rest of the page and organize their style backgorunds, colors etc. And I noticed that i have to click on plus icon for answer to be shown you can change it by creating a parent element that contains question, plus icon and the answer and add event listener to that parent element instead of the plus icon hope you find that helpful
Marked as helpful
2 - kush452• 20
@kush452
Submitted
It was my first time using JS in a project, and i think i did made the design as accurate as i can although the box structure is not too good i accept that. So my question was how can i make myself more familiar while using JS in a project because it took me a lot of time to design this and also how can i hone my designing skills
serdarakova• 260@Serdarq1
Posted
Hi, firstly I recommend setting up the width and height for a better look. Also, to get better at JS I recommend watching some tutorials(especially interactive ones) and then quickly start building projects. If you get stuck at something you can use communities such as stackoverflow to get a solution. I recommend 30-days-of-js doc on GitHub and also Jonas Schmedtmann's JS course on udemy.
0
