スライダーのハンドル自体にテキストとしてスライダーの値を挿入しています。これは、スライド中に正常に機能します。しかし、ページロード時にもその値を表示する必要があります。つまり、スライダーが最初に初期化されるときに値を挿入する必要があり、その方法を突き止めることはできません。
通常は ui.handle を使用してハンドルを取得できますが、「create」イベントのドキュメントによると、「ui オブジェクトは空ですが、他のイベントとの一貫性のために含まれています」。
ここにinit関数があります。関連する唯一のマークアップは、jQuery-ui 自体によって作成されたスライダー内のハンドル (「a」タグ) であるため、ページのマークアップは質問とはほとんど無関係です。
function initMapWidget(){
var map = $('#popup-about-ourstory').children('.map')
, slider = $(map).find('#map-slider')
, yearStart = 1983
, yearEnd = 2013
;
$(slider).slider({
min: yearStart,
max: yearEnd,
create: function( event, ui ){
$(slider).children('a').innerHTML = yearStart;
},
slide: function( event, ui ){
ui.handle.innerHTML = ui.value;
}
});
});
可能であれば、 setTimeout ソリューションから離れたいと思います。