Help me make this code 100% functional. Especially on the Appreciate button I failed to fully customize it and align it properly

Question

https://code.sololearn.com/WlDJl8N9nXtd/?ref=app

Answer 1

Thanks 👍 Kelvin Paul let me update my code. Feel free guys to experiment with the code and help me perfect it.

Answer 2

PyNon Non yes there might not be that much of a difference in the output, but I think all Kelvin Paul was trying to do was to help increase the said slow speed of loading the images.

Answer 3

So how can I increase its speed and efficiency?

Answer 4

Just add a preloader, and remove after loading of the entire page
https://code.sololearn.com/WneTMVOg34ne/?ref=app

or add srcset attribute for different type of device

<picture>
<source media="(max-width:320px)" srcset="low-quality image.ext" />
<source media ....... />
<img src="main-image.ext" />
</picture>

that will automatically load preferred quality for that particular device res.

Answer 5

Kelvin Paul , I'm lost on how to add the srcset attribute for different types of devices as you mentioned, can you please add it onto my code just as you did with the loader. I'm sure it'll be of help not only to me, but everyone else viewing this discussion.

Answer 6

Kelvin Paul , I updated the code but it's stuck at Loading..... Could it be my netwrok?

Answer 7

Oh ok 😃 funny though. Thanks for the feedback PyNon