Dev. Web/JavaScript Jquery

JQuery 예제1 - 탭을 클릭했을 때 포커스를 변경하는 예제

devock 2016. 8. 7. 21:27

[출처] 생활코딩


예제1 - 탭을 클릭했을 때 포커스를 변경하는 예제


<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$('#navigation li').live('click', function() {
$('#navigation li').removeClass('selected');
$(this).addClass('selected');
})
</script>
<style type="text/css">
#navigation li {
list-style:none;
float:left;
padding:5px;
}
#navigation {
cursor:pointer;
}
#navigation .selected {
background-color:red;
color:white;
}
</style>
</head>
<body>
<ul id="navigation">
<li>HTML</li>
<li>CSS</li>
<li>javascript</li>
<li class="selected">jQuery</li>
<li>PHP</li>
<li>mysql</li>
</ul>
</body>
</html>


저작자표시 변경금지