「フォントサイズ」を選択するためのスライダーとしてjQuery UI Slderを作ろうとしています。私の構文のどこに mystake があるのかわかりませんが、うまくいきません。テキスト入力の数値は変更されていますが、テキストサイズは変更されていません...
HTML :
<div id="slider"></div>
<input type="text" id="font_size" style="border:0; color:#222; font-weight:bold;" />
<div class="textBox">Lorem ipsum dolor sit amet, id quaestio percipitur vel. Zril propriae vis in, an mei commune invidunt. Nam et nibh consul, vim ei facer nonumes principes. Nec te facilis noluisse. Utinam doming perfecto eum id, mea at patrioque liberavisse, at sit abhorreant referrentur.</div>
jQuery :
$(function() {
var aFontsSizeArray = new Array('5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '24', '26', '28', '30', '33', '36', '39', '42', '45', '48', '55', '65', '75', '85', '95', '110', '130', '150');
$('#slider').slider({
value: 7,
min: 1,
max: 35,
step: 1,
slide: function(event, ui) {
var sFontSizeArray = aFontsSizeArray[ui.value];
$('#font_size').val(sFontSizeArray + ' px');
$('.textBox').css('font-size', sFontSizeArray );
}
});
$('#font_size').val((aFontsSizeArray[$('#slider').slider('value')]) + ' px');
});