What is wrong with my code?

Question

Why is it not loading as normally?
It worked fine until i made a few improvements at the images. Please help! 😩😩😩
The last time i checked it WORKED FINE on PC , but on phone it takes a lot of time to load and it leave a white screen while scrolling.

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

Answer 1

Whether appear one question each time or appear all at same time is not the problem. The problem is because you try to set cursor style which mobile does not have. Remove all cursor styling on li and loading can become fast again

Answer 2

If i add a confirm box... Asking the user if he uses pc or phone and use js to make the cursor settings only if the user is on pc... And if hes on phone the cursor will not appear.

Answer 3

What if i would make only one question per time to appear. , and use a "Next Question" button to hude the last question and show the next one.

Answer 4

I noticed that your html is particularly difficult to parse because the value are not contained in quotation marks.
Revise all attributes like this way
id="something.ro"

Answer 5

I think that you "display" too many things same time even though they all don't fit in the screen.

Answer 6

<li style=cursor:pointer;
Change all these to
1. Only li in html
2. In css
li{
cursor:pointer;
}

Answer 7

I think in a PC, it knows cursor and do that directly.
In mobile, it doesn't know what cursor is, so the mobile browser takes some time and figure out : "OK, I'm going to ignore this" each time it comes across this attribute style of li

Answer 8

Yes you can add cursor style for computer only

That's @media

@media only screen and (min-width: 500px) {
li {
cursor:pointer;
}
}

Add above to CSS, then when screen width less than 500px (mobile), no cursor style will be set.