본문 바로가기

UI4

브라켓 - Brackets 시스템 UI 언어 변경 어도비 무료 에디터 툴 브라켓 메뉴를 영어로 안녕하세요. 고코더 입니다. 브라켓은 기본적으로 시스템 언어에 따라서 메뉴가 나타납니다. 저는 당연히 한국어 OS를 설치해서 한국어 UI가 기본적으로 셋팅 되었습니다. 하지만 IDE에서 사용하는 영어는 기본적이고 공통적인 단어들입니다. 번역체로 도구를 찾기보다는 영어로 인터페이스를 바꾸어 사용하는게 좋아보입니다. ● 1. 그래서 저는 영어로 UI를 변경해보겠습니다. 탑 메뉴바에서 디버그에서 언어 변경을 클릭 합니다. ● 2. 그리고 원하시는 언어를 선택하고 재시작을 클릭 합니다. 재시작은 시스템 내부에서 새로고침되며 프로그램 자체는 종료되지 않습니다. ● 3. 그러면 이제 익숙한 영어 UI가 나타납니다. 마무리 좀 불편하더라도 영어 UI에 익숙해지는건 어떨까요? 2019. 11. 11.
jQuery UI - 이미지 드래그, 리사이징 / resizable() draggable() 제이쿼리 이미지 드래그 드랍, 사이즈 조절 안녕하세요. 고코더 입니다. jQuery UI를 쓸때 가장 많이 활용하게 되는 기능이 두가지가 있습니다. 바로 이미지 드래그와 리사이징 입니다. 레이어 팝업을 만들거나 사용자에게 크기를 조절하게 편의를 제공 하는 기능은 많이 씁니다. 그래서 이번 시간에 제이쿼리를 이용해 드래그와 리사이징을 동시에 배워보겠습니다. ● 1. 아래 소스를 웹사이트에서 실행해보세요. 1234567891011121314151617 $( document ).ready(function() { $('#GoCoderImg1').resizable(); $('#GoCoderImg2').draggable(); }); Colored by Color Scriptercs ● 2. 하나는 사이즈 조절이 가.. 2019. 6. 11.
jQuery UI - Div 강조하기 / effect highlight Div 반짝 거리게 하기 안녕하세요. 고코더 입니다. Div안에는 많은 것들을 담습니다. 사이트는 강조해야 할 Div가 존재하게 됩니다. ● 1. 얼마전에 만든 제가 만든 QR코드 만들기 사이트에 접속시에 해당 네모 DIV안에 이미지가 나타난다고 알려주고 싶더군요 그래서 알아본 결과 jQuery UI에 제공하는 간단하고 강력력한 기능인 effect를 사용하는 방법이 있습니다. ● 2. 아래에 코드를 웹에서 실행해보세요. 12345678910111213141516171819 $( document ).ready(function() { $('#GoCoderDiv').effect("highlight", 1000); }); DIV 강조 Colored by Color Scriptercs ● 3. 아래처럼 Div가 .. 2019. 6. 3.
jQuery - 선택 요소 사이즈 재조정 / resizeble() div 크기 사용자가 조절 가능한 플러그인 안녕하세요. 고코더 입니다. 자바스크립트에서 사용자에게 특정 요소를 특히 div 를 자유로운 크기로 조절 할 수 있게 하는 기능을 소개하려고 합니다. resizeble 이라는 UI 기능이빈다. https://jqueryui.com/resizable/ 해당 기능은 다양한 곳에 사용이 가능합니다. 사용자 편의에 대시보드를 만들게 하는 곳에 특히 많이 쓰입니다. 그래서 오늘은 이 기능에 대해 다루려고 합니다. 먼저 제가 정리한 간단 예제를 보시겠습니다. 1234567891011121314151617 $(function(){ $("#resizeble").resizable(); }); gocoder ResizebleColored by Color Scriptercs 해당 .. 2019. 3. 14.