본문 바로가기

MENU

css - transition(icon) 이번에 만들어본건 금방 만들주 알았는데... 거의 하루종일 시간이 들어갔다... 모바일에서 많이보이는 햄버그 메뉴(3자 바)를 눌렀을때 X모양으로 변하는걸 많이 봤는데 svg가 아닌 그냥 css,animate로 움직이는것도 있길래 괜찬다 생각이 들어서 만들어보기로 했다. 처음에는 animate로 rotate를 주면될주 알고 했는데... rotate라는 속성은 없더라 그래서 구글링 시작... 찾아보니깐 transform으로 rotate하던지 아니면 jQuery패치? 를 해야 가능한거같더라...젠장 그래서 또 계속 검색하다가 새벽2시쯤... 하코사의 힘을 받아서 도움을 청했다. 햄버그에서 X로 만드는건 해결했는데 X를 햄버그로 다시 만드는데 또 문제 봉착... 각각 이벤트 사이에 딜레이를 줄라니깐 골이아프다.. 더보기
javascript - e.page 간만에 좋은 이벤트를 봐서 따라만들어봤다. 토요타:http://www.toyota.co.kr/2016prius/ 상당히 잘 만든 페이지인데 여러기능이 들어가있다. step1에서는 마치 동영상처럼 이미지넘버를 계속넘겨서 영상처럼 표현한게 대단하게 느껴진다. step2에서는 마우스 움직임에 따른 박스크기조절이다. 더 밑에 내려가면 더 다양한게 있지만 난 2번째껄 만들어보았다. 링크:http://creatijin.dothome.co.kr/project/page/TOYOTA/toyota.html 옛날에 만들어 봤던 마우스 움직임을 계산하는 자바스크립트를 짜봐서 만들 수 있었던거 같다. 더보기
basic-fade 기본슬라이드를 응용해서 fade-slide 로 만들어보았다. 링크:http://creatijin.dothome.co.kr/project/slider/basic-f/basic-f.html [160617 - 수정터치이벤트 추가로 좌우 스와이프 가능해짐] 더보기
basic-slide 이번 슬라이드는 일반적으로 가장 많이 사용된다고 보는 슬라이드의 기본을 만들어보았다. auto,infinite,슬라이드버튼,스탑버튼/플레이버튼 링크:http://creatijin.dothome.co.kr/project/slider/basic/slide.html[160617 - 수정left,right터치이벤트를 추가해서 스와이프를 주었는데 right스와이프는 작동이 원활하나 lefr스와이프가 1페이지일때 문제가 발생한다.] 더보기
javascript - tiles-slide 직접 생각한건 아니고 나를 웹쪽으로 인도해주신분이 만든 슬라이드를 한번 따라해보았다. 물론 비슷만하지 잘 안된거 같아서 아직도 부족함을 느낀다. 링크:http://creatijin.dothome.co.kr/project/slider/tiles/tiles.html 아직까진 익스에서는 작동을 안하는데 이유를 잘 모르겠다. 당분간은 이 문제를 해결해야겠다. 크롬에서는 작동을 하지만 버튼을 연속해서 누르면 오작동이 이뤄진다. 더보기
OWL Carousel 제이쿼리는 잘 사용안하는 편이지만 모든 기능을 다 구현할수는 없기때문에 플러그인을 어느정도는 사용해야된다고 생각한다. 같은기능의 여러 플러그인이 있지만 이번에는 스터디때 알게된 Owl carousel 을 사용해보기도 했다. 링크:http://www.owlcarousel.owlgraphic.com/ 위에 링크는 플러그인 다운받고 사용법이 친절하게 나와있다. 많은 데모중에 images를 한번 적용해보았다. 여러가지 옵션을 정할 수 있고 기본적으로는 모바일에서 터치 스와이프가 가능하게끔 되어있다. 물론 반응형으로 짜여있는걸로 보인다. 링크:http://creatijin.dothome.co.kr/project/plugin/owl/owl-images.html 보통 에이전시나 다른사람들이 사용할때는 커스터마이징을 .. 더보기
sublime text, atom, Brackets 웹프로그래밍 에디터 요즘은 여러 에디터를 써보고 있는데처음에 배울 때는 드림위버를 사용했지만 편리한 기능이 많지만너무 무겁고 설치적인 면에서 좀 불편하다.그다음은 sublim text를 사용했다.sublime text 3 로고일단 제일 가볍다고 생각된다. 거의 메모장 수준으로 가벼움이 느껴지고 확장성 또한 좋아 보인다.유료와 무료가 나눠져있지만 기능의 차이는 없다고 느껴진다.거의 없다고 본다.Brackets 로고Brackets은 어도비에서 나온 에디터 프로그램인데사용해보니 웹 쪽에서는 상당히 좋은 부분이 많고 서브라임 텍스트보단 살짝 무겁지만그 정도는 감안 할 수 있다고 생각된다.Brackets도 sublime txet3처럼 확장성 또한 좋다.FTP/SFTP 패키지가 잘 구현되어있어서 상당히 편했다.Atom 로고아톰도 사용.. 더보기
게임업계, VR 게임 시장선점 나선다 - ZDnet 요즘 핫이슈는 VR 기기인데VR 기기로 즐길 수 있는 콘텐츠가 중요하다고 생각한다.게임업계에서도 이를 놓칠 수 없는 기회인지라 너도나도 개발에 매진 하고있다.이번 기사에서는 여러 업체들이 VR기기를 출시가 임박하면서여러 게임업체들도 VR기기를 이용한 게임 개발에 집중하고 있다는 내용이다.기사에 나온 엠게임, 드래곤 플라이, 조이시티 등 게임업체들이 소개된다.프린세스메이커 VR엠게임 같은 경우에는 원조 딸바보를 만들어낸 프린세스 메이커2 를 활용해서프린세스메이커 VR을 준비중이다.(오큘러스 리프트와 PS VR을 통해 올해 하반기에 출시 목표) 드래곤 플라이는 회사내에 VR전담팀을 두면서 까지 개임개발에 집중을 한다.드래곤플라이는 일인칭슈팅(FPS), 레이싱 2종의 VR 게임을 개발 중이다.VR버전으로 개발.. 더보기