에디터
-
[javascript] Selection과 Range를 통해 내맘대로 커서 조작하기 - Selection편IT, 프로그래밍/Javascript 2019. 12. 16. 09:00
Selection : 사용자가 마우스를 통해 드래그&클릭하거나 키보드를 통해 선택한 텍스트의 범위를 나타냅니다. 혹은 유저의 현재 커서 위치(caret)를 나타냅니다. 크롬, IE 등 브라우저에서는 사용자가 선택한 텍스트에 대한 처리를 지원하기 위해 Selection API를 지원하고 있습니다. 특히 Selection과 Range 객체는 특히 위지위그(WYSIWYG) 에디터, 텍스트 리치 에디터등을 구현할때 중요하게 사용되니까 필요하신 분들은 꼭 알아두시기 바랍니다. Selection은 anchor와 focus를 가지는데요. anchor는 텍스트 선택을 시작한 지점, focus는 선택을 끝낸 지점을 말합니다. Selection은 방향을 가질 수 있습니다. 이 말은 텍스트의 왼쪽에서 오른쪽으로, 혹은 오른..
-
예쁜 위즈윅 에디터, FroalaIT, 프로그래밍/HTML, CSS 2018. 8. 27. 11:14
이번 프로젝트를 진행하면서 적용해 본 Froala 에디터 후기입니다. 먼저 전체 사진을 보여드릴게요. 부트스트랩과 함께 적용한 모습입니다. 반응형으로 예쁘게 나옵니다. 기능도 다양하고, 특히 리소스를 편집하는데 최적화 된 기능을 제공해 줍니다. 편집창을 선택하면 왼쪽에 예쁜 버튼이 나타납니다. 리소스와 표 등을 간편하게 편집할 수 있습니다. 이미지를 올리는것도 직관적이고 편하게 설계되어 있습니다. 제가 가장 마음에 드는건, 업로드 한 이미지를 드래그를 통해서 편하게 편집할 수 있는 기능입니다. 별다른 플러그인 적용없이 사용할 수 있으니 정말 편합니다. 제가 사용하면서 느낀 장단점을 정리할게요. 장점 : 개발자의 입장에서 아주 편하게 다양한 기능들을 구현할 수 있다.API에 대한 정리가 잘 되어있다.찾아보..