Web/jquery

[bpopup] 모바일 bpopup에서 모바일 키패드 이동 클릭시 팝업 꺼지는 이슈

모바일웹에서 bpopup을 썼는데 input에 키패드 이동을 클릭하면 팝업이 꺼져버린다.팝업이 꺼지는게 닫기버튼을 누른것도 아니고 그렇다고 esc된 것도 아닌 엔터!를 누른 효과였다.그런데 이상한게 다른 페이지에서 이동을 클릭하면 아무렇지 않았다.이슈가 난 팝업내의 input은 input=text와 데이터피커가 연결되어있는 부분이었다. 이런 이슈가 난 이유는 알 수 없지만 어디서 이슈가 생기는지는 알았으니 직관적으로 해결 할 수 밖에.. $(document).on('keydown','#BABY_NM',function (key) { if(key.keyCode == 13){//13 == enter event.preventDefault(); if( $("#BABY_NM").val() != "" ){ $('#B..

[제이쿼리] 이벤트

이벤트 트리거 키보드 이벤트 keydown keypress keyup 브라우저 이벤트 error resize scroll 마우스 이벤트 click contextmenu //오른쪽 마우스 이벤트 dbclick hover mousedown mouseenter mouseleave mousemove mouseout mouseover mouseup toggle 폼 이벤트 blur change focus focusin focusout select submit 문서 이벤트 load ready unload bind => on unbind => off

[제이쿼리] 제이쿼리 selector 정리

@DOM Selectors $('#id')=>document.getElementById('id') // IE 5.5+=>document.querySelector('#id') // IE 8+*두 메서드 모두 단일 요소를 반환합니다. getElementById는 querySelector를 사용하는 것보다 효율적입니다. $('.class')=>document.getElementsByClassName('class')[i] // IE 9+=>document.querySelectorAll('.class')[i] // IE 8+*첫 번째 메서드는 HTMLCollection을 반환하며 두 가지 중에서 가장 효율적입니다. querySelectorAll은 항상 NodeList를 반환합니다. $('tag')=>documen..

[플러그인] bpopup.js

http://dinbror.dk/bpopup/ 팝업 플러그인이 뭐가 있을까 검색하다가 알게 된 제이쿼리 bpopup커스텀이 쉽고 api설정도 간편하다. 하지만 기존 팝업안에서 버튼 클릭 시 기존 팝업은 사라지고 다른 팝업이 생겼으면 하는데그런 디테일을 api로 잡아주기엔 너무 복잡하고 그냥 제이쿼리로 hide/show 하는 것보다 귀찮아진다. 간단하게 하나의 팝업 안에 유튜브, 슬라이드 같은 걸 넣을때는 괜찮은 것 같다. bg도 바로 정할 수 있고, bg 클릭 시 팝업이 닫히거나, 따로 클래스를 줘서 팝업을 닫게 하거나 등등..활용도가 매우 높은 팝업 플러그인이다. 굿 익스 하위 버전에서도 잘 돌아간다~~

[제이쿼리] 현재 위치에서 팝업창 가운데로 띄우기

스크롤 바를 내린 상태에서 팝업 창을 띄우면 상단에 팝업창이 생기는 문제가 발생할 수 있다. "top": (($(window).height()-$("#popupDiv").outerHeight())/2+$(window).scrollTop())+"px""left": (($(window).width()-$("#popupDiv").outerWidth())/2+$(window).scrollLeft())+"px" 위 공식을 사용하면 현재 위치에서 가운데에 팝업창을 띄울 수 있다. $("body").css("overflow","hidden");//body 스크롤바 없애기 $("body").css("overflow","auto");//body 스크롤바 생성 body의 overflow를 건드는 이유는 팝업창을 띄운 고정..

[제이쿼리] hover -> .stop(true,true)

*위쎈(http://www.bulgariswissen.com/weissen1707/index.asp)페이지 상단 네비부분 호버했을 때 서브네비가 내려와야 함.처음에 마우스리브를 썼었는데 마우스가 왔다갔다 하는 액션을 다 받아서서브네비가 메롱거림... => 클릭 시 버블링 막아주고, .stop(true,true) 넣어주면 괜찮아진다. 기억하기~! $('#header .gnb .health_nav').hover(function(e){ e.preventDefault(); e.stopPropagation(); $(this).children('a').stop(true,true).addClass('on'); $(this).children('ul').stop(true,true).slideDown(); },functi..

[제이쿼리] 콜백 함수

jQuery 콜백 함수 JavaScript 문은 한 줄씩 실행됩니다. 그러나 효과를 사용하면 효과가 완료되지 않은 경우에도 다음 코드 줄을 실행할 수 있습니다. 이로 인해 오류가 발생할 수 있습니다. 이를 방지하기 위해 콜백 함수를 만들 수 있습니다. 콜백 함수는 현재 효과가 끝난 후에 실행됩니다.

[AJAX] ajax에서 jquery찾기

ajax에서 jquery $(document).on('click', '선택자이름', function(){ }); ===>>> ajax 동적으로 클래스가 생기기 때문에문서가 로딩이 된 후에 클래스가 생겨서 그걸 못읽음

[AJAX] ajax기본

$.ajax({ url: 'product_list_append.php', //url주소 dataType: 'html', //타입:html or json type: 'GET', //호출 타입 :GET,POST.. data:{ code : "", s_code : "", page : page }, //보내고자 하는 데이터. 이건 개발자와 상의해야함 beforesend : function(){ $('.roading').show(); }, //보내기전 success: function(html) { $('#appendProduct').append(html); } });

[제이쿼리] 스크롤 부드럽게 내려가기

//부드럽게 올라가기$(function(){ $(".event_up").click( function() { $("html, body").animate( { scrollTop : 0 }, 350 ); return false; } ); }); // 앵커 부드럽게 내려가기$('a').click(function(){ $('html, body').animate({scrollTop: $( $.attr(this, 'href') ).offset().top}, 500); return false;}); // 앵커 부드럽게 내려가기$('a').on('click', function(event){ event.preventDefault(); var fixedHeight = $('.nav_wrap').height(); // 상단 ..