간단한 기능 정도만 구현 되어 있는데요.
공부도 할 겸 이를 기반으로 좀 더 기능을 확장해 보는것도 나쁘지 않겠네요~ㅎㅎ
javascript - 사용된 주요 함수 설명
- exexCommand
textarea_elem.execCommand('bold', false, null);
: textarea 나 contentEditable 속성을 true로 준 DIV에서 사용.
쉽고 깔끔하게 요소의 속성을 조절할 수 있음.
상세설명 참고 : https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand
- queryselector
document.querySelector('.boldify').addEventListener('click', boldify);
: 간편하게 CSS 셀렉터로 요소를 가져오기 위해 사용함.
jquery 셀렉터와 비슷하다고 보면 되겟군.
상세설명 참고 : http://www.w3schools.com/jsref/met_document_queryselector.asp
간단한 사용 예제 및 Demo
'Dev. 웹 > Front-end 웹개발을 위한 codepen' 카테고리의 다른 글
[2015.11.17] css, javascript 를 활용한 메뉴 Line animation (0) | 2015.11.17 |
---|---|
[2015.11.12] 타이머 디자인 (0) | 2015.11.12 |
[2015.10.30] 깔끔하고 귀여운 연습장 레이아웃 (0) | 2015.10.30 |
[2015.10.29] javascript, css3 를 활용한 오델로 게임 (1) | 2015.10.29 |
[2015.10.27] CSS 레이아웃 구성을 이용한 Browser 디자인 (0) | 2015.10.27 |