css 버튼 질문입니다
본문
css 에서 active일때 색이 변경되는데
a요소를 누르면 색이 변경되고 다시누를때까지 유지시키려면 어떻게 해야하나요
ex
a:active {color #000;}
답변 3
$('a').toggle(function() {
$(this).addClass('active');
}, function() {
$(this).removeClass('active');
});
<css>
a.green{color: #0f0;}
<jquery>
$('a').on('click', function () {
$('a').removeClass();
$(this).addClass('green');
});
쉬운 자바스크립트로 무식하게 하면 아래와 같습니다만 의미가 있는가는 모르겠네요.
a 요소는 누르면 이동을 하는데 어떻게 색상이 유지되죠??? 아래는 임시로 이동을 못하도록 href 를 조작했습니다.
<a href="javascript:;" style="color:red;" data-save-color="blue" onclick="var tmp = this.style.color; this.style.color = this.dataset.saveColor; this.dataset.saveColor= tmp;">클릭</a>
위와 같이 하면 색상이 유지 됩니다. 그런데 왜? 그렇게 하죠??? A 에 거는 것보다 이동할것이 아니라면 아래가 더 편합니다.
<style>
#checkbox_id:checked + label { color:red; }
</style>
<input type="checkbox" style="display:none" id="checkbox_id"><label for="checkbox_id">클릭</label>
답변을 작성하시기 전에 로그인 해주세요.