Single Page Design using Javascript, HTML, CSS/SCSS
Design comparison
Solution retrospective
Loved completing this project. I had some trouble with the JS image slider. There is a few bugs that needs to fixed with the slider part. Such as:
- looping back to the first photo when the user reaches the last photo -looping to the last photo if the user clicks past the first photo
Any suggestions and feedback are very much appreciated!
Thank you!
Community feedback
- @DavidMorgadePosted over 2 years ago
Hello Nyrell congrats on finishing the challenge!
Regarding your question about the slider, I will suggest you to use a external library that can help you a lot, you don't need to recreate the wheel in this case, you can use swiper.js, and create awesome Sliders in no-time, they have a good documentation and support for every framework (including, ofc, vanilla Javascript).
The other thing that I think is falling a bit on your project is the layout for mobile devices, in your
.grid-container
for example, you are using amax-width: 414px
wich is making yourgrid
overlay from the screen, instead try using768px
wich is the limit for mobile screen sizes.Hope my feedback helps you, if you have any questions don't hesitate to ask, I will try to help you as much as I can!
Marked as helpful0@nyrellclPosted over 2 years ago@DavidMorgade
Hello David,
Thanks so much for the suggestions. I will definitely replace the slider code with swiper.js it'll help me practice with using external libraries more.
Ah yes i had some minor issues with the responsive part. using 768px might just do the trick.
Thanks again!
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord