When user is visiting my webpage, bootstrap switch doesn't render properly at the first time, look:
Then, other times normal:
What I think is happening is that the page is rendering first than the Bootstrap Switch! Even using the Jquery ready function, as below:
$(function() {
var btn_is_active = $("#btn-is-active");
var btn_is_public = $("#btn-is-public");
btn_is_active.bootstrapSwitch('state', {{ event.is_active|lower }});
btn_is_public.bootstrapSwitch('state', {{ event.is_public|lower }});
});
I really want to avoid this kind of bad experience for the user, what should I do to fix it?