如何调整Highslide JS以适应新的响应式设计

Question

大约5年前，我在http://wela.ctc.edu/academy12-13.aspx (示例页面)这个网站上使用了Highslide JS。现在，我正在使用Twitter.Bootstrap重新设计网站，并试图弄清楚如何调整Highslide弹出窗口以在较小的设备宽度下工作。这是可能的，还是我应该使用另一个解决方案来实现？我已经尝试了在我的highslide- with -html.js文件中设置参数，但结果并不令人满意。如果可以在响应式设计中使用Highslide，请查看任何URL。

Answer 1

简而言之，如果你要打开图片，Highslide非常适合小型设备。扩展器就是专门为此而构建的-在不超出视口边界的情况下尽可能大地显示图像。

但是当打开任何其他东西时--一个包含HTML内容的扩展器，一个iframe等等--扩展器最初必须是一个固定的大小。您可以在其上放置一个调整大小的手柄，但对于处理从智能手机到大型显示器的所有内容来说，这并不是很好。

如果不重写Highslide JS，就需要您的页面自己检测视区大小，然后动态地修改对htmlExpand()的调用(可能使用一些jQuery操作)，或者更改.Highlide-html CSS类宽度，从而克服这一限制。后一种方法(以CSS为目标)似乎更容易一些。