Menu icon Foundation
Scaling slides in orbit content slider

I've built a slider that mimics a powerpoint presentation. It looks alright contained in a column since the size doesn't vary too much. I've also used the bigscreen api (https://github.com/bdougherty/BigScreen) to allow the containing element to inhabit the entire screen (instead of the entire space inside the column). When this happens, the aspect ratio can change quite significantly, and obviously effective resolution of the space taken by the slider is changed significantly.

What is the best way to scale up the mix of text and images that inhabit the slides? Any suggestions?

OrbitFoundation 5FullscreenBigScreen

I've built a slider that mimics a powerpoint presentation. It looks alright contained in a column since the size doesn't vary too much. I've also used the bigscreen api (https://github.com/bdougherty/BigScreen) to allow the containing element to inhabit the entire screen (instead of the entire space inside the column). When this happens, the aspect ratio can change quite significantly, and obviously effective resolution of the space taken by the slider is changed significantly.

What is the best way to scale up the mix of text and images that inhabit the slides? Any suggestions?

Char Zango over 5 years ago

I've been thinking/looking around and will probably go with a javascript solution if nothing exists to handle font-scaling inside foundation.

e.g.,

Something like this (http://jsfiddle.net/8TrTU/):
$(document).ready(function() {
var fontSize = parseInt($("#container").height())+"px";
alert(fontSize);
$("#container span").css('font-size', fontSize);
});