Jquery UI Slider

Ui Slider mit jquery bibliothek

Example:

Select a Speed:

From:

To:

&lt;script type="text/javascript" src="/wp-content/themes/bitsndots/webdev/slider/jquery-ui-1.7.1.custom.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="/wp-content/themes/bitsndots/webdev/slider/selectToUISlider.jQuery.js"&gt;&lt;/script&gt;
&lt;link rel="stylesheet" href="/wp-content/themes/bitsndots/webdev/slider/slider.css" type="text/css" /&gt;
&lt;link rel="stylesheet" href="/wp-content/themes/bitsndots/webdev/slider/ui.css" type="text/css" /&gt;
&lt;script type="text/javascript"&gt;
	$(document).ready(function(){
		$('select#speed').selectToUISlider().next();
		$('select#valueAA, select#valueBB').selectToUISlider({
			labels: 12
		});
		fixToolTipColor();
	});
	function fixToolTipColor(){
		//grab the bg color from the tooltip content - set top border of pointer to same
		$('.ui-tooltip-pointer-down-inner').each(function(){
			var bWidth = $('.ui-tooltip-pointer-down-inner').css('borderTopWidth');
			var bColor = $(this).parents('.ui-slider-tooltip').css('backgroundColor')
			$(this).css('border-top', bWidth+' solid '+bColor);
		});
	}
&lt;/script&gt;

$(document).ready(function(){

$('select#speed').selectToUISlider().next();

$('select#valueAA, select#valueBB').selectToUISlider({

labels: 12

});

fixToolTipColor();

});

function fixToolTipColor(){

//grab the bg color from the tooltip content - set top border of pointer to same

$('.ui-tooltip-pointer-down-inner').each(function(){

var bWidth = $('.ui-tooltip-pointer-down-inner').css('borderTopWidth');

var bColor = $(this).parents('.ui-slider-tooltip').css('backgroundColor')

$(this).css('border-top', bWidth+' solid '+bColor);

});

}

</script>

Leave a reply Antworten abbrechen

Neue Beiträge

Kategorien

Archive

Meta