jQuery UI 버튼

1 개요[ | ]

jQuery UI 버튼
html
Copy
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<style>
.button_10em { font-size: 1.0em }
.button_09em { font-size: 0.9em }
.button_07em { font-size: 0.7em }
</style>

<button id='btn1' class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
	<span class="ui-button-text">버튼 1</span>
</button>
<button id='btn2' class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all button_10em">
	<span class="ui-button-text">버튼 2</span>
</button>
<button id='btn3' class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all button_09em">
	<span class="ui-button-text">버튼 3</span>
</button>
<button id='btn4' class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all button_07em">
	<span class="ui-button-text">버튼 4</span>
</button>

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<script>
$('button').click(function() {
	alert(this.id+" 버튼을 누르셨습니다.");
});
</script>

2 같이 보기[ | ]