Skip to content
OverviewSolutions
9
Comments
5
Mohammed Zakaria Khan
@zaks276

All comments

  • Federico•80
    @02fede02Submitted about 2 years ago

    Didn't know if it was better to make the "submit component" in the HTML, hided it and then change that via JS or directly do the render in JS.

    Made it with tailwindcss

    1
    Mohammed Zakaria Khan•180
    @zaks276Posted about 2 years ago

    Hello Federico. Great job on the solution. It looks amazing.

    To answer your question, both methods are fine however in my experience the image tends to load more slowly when you do the render in Javascript instead of hiding the HTML and then displaying it via Javascript. Generally too much Javascript tends to slow down websites.

    Hope this was helpful.

    Marked as helpful
    0
  • Luka Simic•10
    @Cv1CC1Submitted about 2 years ago

    Hello guys, check out the page, leave a comment about it, and if you have time check out the code and give feedback. Thanks!

    Interactive rating component

    1
    Mohammed Zakaria Khan•180
    @zaks276Posted about 2 years ago

    Hello Luka.

    • You forgot to set the cursor to pointer when hovering over the buttons. Just set the cursor: pointer wherever you have the :hover CSS psuedo-class.
    • Also you can use the defer attribute in your script tag so you can put it in the <head> tag instead of at the bottom of the <body> tag.

    Other than that, great job. Your solution looks great. I hope this was helpful

    Marked as helpful
    1
  • Amit Kumar•100
    @amit-kumar-18Submitted over 2 years ago
    • The image in thank you window seems to load slower than the rest of the page.
    • Submit button has a weird outline on the upper corner.

    These are my main concerns any other feedback is most welcome. " I have created a fun little animation on the star feel free to explore."

    Interactive Rating Component

    2
    Mohammed Zakaria Khan•180
    @zaks276Posted over 2 years ago

    Hello Amit. Good job on the solution. I like the little animation. Its a nice touch.

    • To remove the border on the submit button use border: none; in your CSS.
    • As for the slow loading image, I believe it is due to rendering the thank you window via Javascript. I've noticed the same effect with other solutions that used this method.

    I hope this was helpful.

    0
  • Mohammed Zakaria Khan•180
    @zaks276Posted over 2 years ago

    Hello Dennis.

    Good work on the solution it looks great. However it is a little big compared to the original design. I recommend using Greenshot to get the measurements for the component so the solution can be as close to the design as possible.

    I hope this was helpful

    0
  • Ed•720
    @EdwinSchSubmitted over 2 years ago

    Hi all, build the rating component in plain CSS and JavaScript. Also added a validation to the submit button to check for user input. And users can only select one rating at a time.

    Rating component with CSS and JavaScript

    1
    Mohammed Zakaria Khan•180
    @zaks276Posted over 2 years ago

    Hello Ed. Good job on the design, your solution looks great. I have some tips for you, you should consider using tags such as <main> or <article> etc instead of only <div>. Also you can use the defer attribute in your script tag so you can put it in the <head> instead of at the bottom of the <body> tag. I hope this was helpful.

    Marked as helpful
    0