본문 바로가기
반응형

Programing/HTML23

[JS] 스크롤시 사라지는 jQuery 배너 플러그인 1. 플러그인 개요 화면 특정 위치에 배너를 고정하고 스크롤시 배너가 스르륵 사라졌다가 스크롤이 끝나면 다시 스르륵 나타나도록 하는 jQuery 플러그인입니다. 2. 메커니즘 jQuery에 있는 scroll 내장함수와 JavaScript의 Interval 기능을 조합하였습니다. 3. 사용법 배너를 감싸고 있는 division에 floatBanner 메소드를 걸어줍니다. wrapperId : division 이름 animateTime : 배너가 완전히 사라지는데까지 혹은 나타나는데까지 걸리는 시간 intervalTime : 스크롤이 멈추고 배너가 나타는대까지 시간 bottom : 배너의 위치 width : 배너의 크기 $("#pop").floatBanner({ "wrapperId" : "pop", "ani.. 2013. 7. 30.
[JS] jQuery를 이용한 스크롤배너 플러그인 jQuery를 이용한 스크롤배너 플러그인 입니다. **버그수정** 메소드명 수정 : 기존메소드(scroll)명을 변경했습니다. 변경된 이름은 scrollBanner 입니다. ** 사용법 ** jQuery 라이브러리와 아래의 JS가 추가된 상태에서 배너 DIV에 scroll 함수를 실행합니다. 옵션값들중에 필수 값이 있으니 옵션값 누락시 예외가 떨어질수 있습니다. $(".cContents").scrollBanner({ "cContentsClass" : "cContents", //스크롤을 감싸고 있는 영역(DIV)의 클래스명 "cContentsWidth" : "100%", //스크롤을 감싸고 있는 영역(DIV)의 넓이 "cContentsHeight" : "160px", //스크롤을 감싸고 있는 영역(DIV).. 2013. 7. 22.
[JS] HTML5 WebStorage 1. 지원하는 브라우저의 종류웹스토리지는 IE8+, 파이어폭스, 오페라, 크롬, 사파리를 지원합니다.IE7과 그 이전버젼에서는 지원하지 않습니다. 2. 데이터 저장 객체클라이언트에 데이터를 저장하기위한 두 종류의 객체가 있습니다.localStorage - 시간이 지나도 저장된 데이터가 지워지지 않습니다.같은 브라우저내에 다른 윈도우창에서도 데이터가 공유됩니다. sessionStorage - 하나의 세션의 데이터가 저장됩니다. server session의 개념과 다릅니다. 해당 윈도우내에서만 데이터가 공유됩니다. 같은 브라우저내의 같은 도메인이라도 윈도우창이 다르면 데이터를 공유하지 않습니다. 3. 스토리지 지원 여부 체크if ( typeof(Storage) !== "undefined" ) { //웹 스토.. 2013. 6. 28.
[JS] IOS Safari에서 화면회전시 가로 스크롤이 생기는 버그 해결방법 IOS 계열 사파리 브라우저에서 화면을 회전하면 브라우저에 가로 스크롤이 생기는 경우가 있다. 사파리에서 화면을 회전하면 textArea의 placeholder 영역이 늘어나면서 생기는 현상이다. 화면회전시 placeholder를 제거했다가 다시 추가해주는 방법으로 처리해야한다. 1. 화면회전에 대한 이벤트를 걸어준다. $(window).bind("orientationchange", fm_optimizeInput); 2. 모든 textArea의 placeholder를 제거하고 다시 설정한다. function fm_optimizeInput(){ ${"input[placeholder],textarea[placeholder]").each(function(){ var tmpText = $(this).attr(".. 2013. 6. 26.
반응형

티스토리툴바