You will need some additional custom code – just include it after jQuery on your page:
// SmartMenus jQuery - Center first level sub menus to parent item
$(function() {
$('#main-menu').bind('show.smapi', function(e, menu) {
var $menu = $(menu);
// check just first-level subs
if ($menu.dataSM('level') == 2) {
var obj = $(this).data('smartmenus'),
$item = $menu.dataSM('parent-a'),
itemW = obj.getWidth($item),
menuW = obj.getWidth($menu),
menuX = (itemW - menuW) / 2;
// keep supporting keepInViewport
if (obj.opts.keepInViewport) {
var $win = $(window),
winX = $win.scrollLeft(),
winW = obj.getViewportWidth(),
itemX = $item.offset().left,
absX = itemX + menuX;
if (absX < winX) {
menuX += winX - absX;
} else if (absX + menuW > winX + winW) {
menuX += winX + winW - menuW - absX;
}
}
$menu.css('margin-left', menuX);
if ($menu.dataSM('ie-shim')) {
$menu.dataSM('ie-shim').css('margin-left', menuX);
}
}
});
});
Assuming your root UL element has id="main-menu"
this should work no matter whether you are using the script with/without the Bootstrap addon.