How do I get this function to not only run on window resize but also on initial page load?
$(window).resize(function() {
...
});
This behavior is by design.
You should put your code into a named function, then call the function.
For example:
function onResize() { ... }
$(onResize);
$(window).resize(onresize);
Alternatively, you can make a plugin to automatically bind and execute a handler:
$.fn.bindAndExec = function(eventNames, handler) {
this.bind(eventNames, handler).each(handler);
};
$(window).bindAndExec('resize', function() { ... });
Note that it won't work correctly if the handler uses the event
object, and that it doesn't cover every overload of the bind
method.