自动将Qualtrics中的图形调整为参与者的屏幕？

Question

我正在寻找一种类似于mousetracker的模型，在这种模型中，调查参与者可以在两个选项之一之间进行选择。 我已经弄清楚了实际的鼠标跟踪代码。 我的问题是创建参与者可以选择的图像。 如果我做的太小，选择之间就不会有太大的差异。 如果我将其设置得太大，则具有小屏幕的参与者将不得不滚动查看这两个图像，并且调查的重点将变得毫无意义。

有什么方法可以使用CSS或Javascript进行编码，以使图像进行扩展以适合其各自的浏览器/屏幕？ 我发现与此相关的代码可用于背景，但不幸的是，由于会有一系列不同的图片，因此无法使用。

谢谢！

Answer 1

您可以使用vh / vw 单位设置图像的最大宽度/高度。 1vh是视口（浏览器窗口）高度的1％，1vw是视口宽度的1％。

示例：CSS： .fit {max-height: 60vh;}

HTML： <img class="fit" src="x">

（您可以在此处找到如何在Qualtrics中添加自己的CSS。）