самое простое решение. (непроверено, но суть думаю обьяснит)
$( "#slider" ).slider({
value:100,
min: 0,
max: 500,
step: 50,
//У слайдера есть обработчик события slide который вызывается при каждом перемещении слайдера.
slide: function( event, ui ) {
//ui.values - нас не устраивает, значения придётся пересчитывать обратно в пиксельные координаты
// с учётом мин макс и step и физической ширины слайдера в придачу, а нам конечно-же лень))
// Поэтому как настоящее быдло, возьмём координаты прямо из бегунка :)
var x=$("#slider").find(".ui-slider-handle").offset().left;
// позиционируем индикатор аналогично бегунку
$("#indicator").offset({left:x});
// устанавливаем значения в индикатор
$("#indicator").html(ui.value);
}
});
кроме slide, возможно есть смысл обрабатывать событие slide, для инициализации #indicator.
можно сделать чуть удобнее если вмето $("#slider"). использовать что-то вроде $(this), или $(ui.чтотоТам)- здесь лучше документацию посмотреть, и поэксперементировать.