animate
-
일정시간 팝업 노출 간단히 구현해보자 :: 마이구미HTML, CSS 2016. 11. 22. 19:41
이번 글은 "일정시간 팝업 노출" 에 대해 다뤄본다. 일단 주제를 자세히 알기 위해 아래 링크를 방문해보자. https://www.agoda.com/ko-kr/city/fukuoka-jp.html http://gostaygolf.com/goods/view.html?pid=67 아래 이미지 보자. 위 링크와 같이 자동으로 팝업이 나왔다가 사라지는 경우를 많이 볼 수 있다. 사실상 크게 어려운 작업이 없다. 하지만 수요가 많기에 개발능력이 미숙한 사람들이 많이 찾아올 꺼 같아서 글을 쓴다. 쉽지만 누구나 히스토리에 남길만한 주제로 괜찮다고 생각했다. 본인이 간단하게 작성한 테스트 페이지이다. 테스트 페이지 여기서 핵심적인 것은 position:fixed 속성이다. css의 position을 사용할 때는 거의..
-
animate를 활용한 상단 메뉴 노출 :: 마이구미Javascript 2016. 8. 2. 15:43
이번 글은 제이쿼리의 animate 메소드의 활용법에 대하여 알아볼 것이다.이번 주제는 지식인으로부터 팁을 얻었다. 지식인에 질문이 올라왔다.http://www.kwater.or.kr/main.do?s_mid=1#this 위의 이미지는 첫 로딩 시 기본 페이지이다.상단부분 오른쪽 돋보기 버튼이 보이는가?돋보기 버튼을 누른다면 아래 이미지처럼 통합검색이라는 영역이 노출될 것이다. 즉 돋보기 버튼을 누른다면 통합검색 영역이 상단 메뉴 영역이 노출된다.통합검색 영역의 오른쪽 닫기 버튼을 누른다면 노출된 영역이 사라진다.직접 페이지에서 해보길 바란다. 많이 볼 수 있고, 많이 활용되고 있는 기능이다.이거 또한 다른 글 transition으로 가능하다.여기서는 jquery의 animate 메소드를 사용해보겠다. ..