我正在开发一个项目,使用Reveal JS以幻灯片形式向用户呈现数据。
有时我发现文字溢出视口。
因此,文字不可见,如此图所示:
我已经尝试根据屏幕高度动态缩小文本大小,例如:
var $present_section = $('section.present');
var section_bottom = $present_section.offset().top + $present_section.height();
var allowed_height = $(document).height() - $present_section.offset().top;
if (section_bottom > allowed_height) {
var cur_font_size = parseInt($present_section.css('font-size'));
$present_section.css('font-size', cur_font_size - 1);
}
运行这段代码的递归循环将调整 <section>
的字体大小以适应文档高度。
有没有更好的方法或插件来解决这个问题而不减少幻灯片中字符的数量?