jQuery functions not firing until you resize window

jQuery functions not firing until you resize window

I have a Foundation Orbit image slider that doesn't show up until you
resize the browser window. The space is empty until you even just change
the window size by a pixel. Foundation is calculating the hight of the
slider on the fly but when the page first loads there's no height set on
the container.
I also have a nav bar that doesn't correct itself to its calculated width
until I resize the window.
Here's the nav bar code:
Ew.ApplicationView = Ember.View.extend({
didInsertElement: function() {
$(".nav").width($(window).width() - 406);
$(".subnav").width($(window).width() - 396);
return $(window).resize(function() {
$(".nav").width($(window).width() - 406);
return $(".subnav").width($(window).width() - 396);
});
}
});
And the slider initialization code:
Ew.OrbitSliderComponent = Ember.Component.extend({
initOrbit: function() {
$(document).foundation('orbit', {
stack_on_small: true;
navigation_arrows: false;
variable_height: true;
});
}.on('didInsertElement')
});
What causes jQuery functions to not fire until the window resizes?