본문 바로가기

World Wide Web

window scroll 막고 해제하기(IE9 이상) 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647스크롤 막기 function blockWheel() { jQuery(window).on("mousewheel.disableScroll DOMMouseScroll.disableScroll touchmove.disableScroll", function(e) { e.preventDefault(); return; }); jQuery(window).on("keydown.disableScroll", function(e) { var eventKeyArray = [32, 33, 34, 35, 36, 37, 38, 39, 40]; for (var i = 0; i 더보기
stopPropagation과 preventDefault의 차이점 javascript 에서는, 이벤트를 막기 위해서는 stopPropagation() 과 preventDefault() 를 쓴다.이전에는 이 이벤트들의 차이를 멋도 모르고 그냥 썼는데, 최근에 우연히 이 둘의 차이를 확실하게 알게 되어 적어 놓는다.이 둘의 차이는, 사용자가 발생한 이벤트를 막느냐, 기본 이벤트를 막느냐의 차이다.예를 들어, 이런 코드를 보자. 사용자가 여기서, 이미지를 클릭한다면 어찌 될까?아마도 "click img1" 이 alert 로 뜨고, 다음 "click div1" 이 뜨고, 그 다음 www.daum.net 으로 넘어갈 거다.만일 onclick 함수에서 stopPropargation() 을 쓰면, 사용자의 액션에 의한 이벤트 전파가 막아지므로, "click div1" 의 alert.. 더보기
jquery로 font-size, color를 animate 시켜보기 kanarazu asuha kurukara 더보기
float 해제하는 방법 float을 해제하는 방법 방법 풀이 1 float된 박스들의 바로 다음 박스에 clear:both;한다- 바로 다음에 박스가 없으면 사용할 수 없다 2 float된 박스들을 감싸는 박스를 다시 floatLleft;한다- 그 float까지 연쇄적으로 해제해야하면 width값을 주어야 크로스브라우징된다. 3 float된 박스들을 감싸는 박스에 overflow:auto/overflow:hidden한다- 세로 스크롤바가 생길 경우 사용할 수 없으면 width값을 주어야 크로스브라우징 된다. 4 float된 박스들을 감싸는 박스에 height값을 준다본문내용엔 높이를 주지 않으므로 세로 사이즈가 불변일 경우가 아니면 사용이 불가능 5 float된 박스들을 감싸는 박스에 가상요소 :after를 주어 해제한다.- .. 더보기
[플러그인] 제이쿼리로 곡선 모션 표현하기 var bezier_params = {start: {x: 626,y: 170,angle:240,length:1.5},end: {x:556,y:268,angle: 80,length:3.6}}; jQuery(".mainVisualDiv .abolu4").animate({path : new $.path.bezier(bezier_params)}, 1600); http://jqbezier.ericlesch.com/ 더보기
다른 페이지로 벗어날때 인터벌 정지시키기 다른 페이지를 보거나, 창을 최소화 시킬때 인터벌을 정지시켜 성능을 향상12345jQuery(window).blur(function(){ clearInterval(vInterval); })cs 포커스가 현재 창으로 되돌아올때 인터벌 다시 재생1234567jQuery(window).focus(function(){ clearInterval(vInterval); vInterval = setInterval("visual()", vTime); })Colored by Color Scriptercs 더보기
jquery로 css 백그라운드 이미지 변경 123jQuery('.one_a a').css({"background":"url(../img/menu_shadow01.gif)", 'background-repeat' : 'no-repeat', 'background-position':'center center'}); Colored by Color Scriptercs 더보기
네방향 마우스 이벤트 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273//People 마우스 오버 jQuery(".mainPeople>a").each(function(){ jQuery(this).mouseenter(function(event){ w = jQuery(this).width() h = jQuery(this).height() x = ( event.pageX - jQuery(this).offset().left - ( w/2 )) * ( w > h ? ( h/w ) : 1 ), y = ( event.pageY - jQuery(.. 더보기
브라우저 체크 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859601. 브라우저 헤더정보 function userAgent(){ var browserType = ""; if(navigator.userAgent.indexOf("Chrome") != -1) { browserType = "CR"; return browserType; } if(navigator.userAgent.indexOf("like Gecko") != -1 || navigator.userAgent.indexOf("MSIE") != -1) //like Gecko는 IE11용 { browserType = "IE";.. 더보기
jquery.color.js 사용법 범위 : backgroundColor, borderBottomColor, borderLeftColor, borderRightColor, borderTopColor, color, columnRuleColor, outlineColor, textDecorationColor, textEmphasisColor 123jQuery(".visual01").stop().animate({backgroundColor:"#f5f3d8"}, 600); jQuery(".colorTxt").animate({color:"#ff0000"}, 300);cs 더보기