[SpeedGrader] Student Selection - Left arrow moves when image loads

[lybberte]

Problem statement:

When using the SpeedGrader, if you press the left arrow in the student selection bar (at the top right) it doesn't stay in the same location because some images take longer to load. When quickly trying to flip through students to the left, it often is slow because the arrow can't just be clicked multiple times in a row with the arrow moving so much.

Proposed solution:

My suggestion is a simple one that should be easy to implement. In the HTML of the page, adding a height and width to the student image tag () should make the box the exact size if the image has loaded or not. The parent div is being set to 30px by 30px in the CSS, and this could be mirrored in the HTML. This would stop it from jumping when trying to flip through the students to the left quickly. Here is the existing code with my suggested edit (width="30" height="30"):

User role(s):

instructor

[lybberte]

It stripped out my code, but enough information is still there to understand what is being suggested.