본문 바로가기

World Wide Web/jquery

HTML5 video fullscreen HTML5의 비디오태그로 전체화면을 하는 javascript방법과 css방법이다. 1. JAVASCRIPT12345678var elem = document.getElementById("myvideo");if (elem.requestFullscreen) { elem.requestFullscreen(); } else if (elem.mozRequestFullScreen) { elem.mozRequestFullScreen(); } else if (elem.webkitRequestFullscreen) { elem.webkitRequestFullscreen(); }Colored by Color Scriptercs 2. CSS1234567video { position: fixed; right: 0; bottom: .. 더보기
레이어팝업 띄우고 포커스 레이어팝업으로 이동시키기 웹접근성 인증마크를 획득하지 않더라도 기본적으로 표준을 준비하는것이 좋다.신규구축에는 인증마크 획득 이슈가 없더라도 구축이 완료된 후에 따로 재의뢰가 들어오는 경우도 있기때문이다. 이런 경우를 가끔 겪다보니 이제는 표준을 준수하면서 코딩을 해나가고 있다. 요즘은 디자이너 또는 고객사의 요청으로 윈도우팝업보다는 레이어팝업이 더욱 많이 이용되고 있는것이 현실이고 이에 대응하기 위해서 레이어팝업을 띄우면 탭으로 포커스 이동시 바로 팝업으로 향해야된다. 오늘은 그 방법을 알아보도록 하자.12345678910111213141516171819202122var $this; $(".btn").click(function(){ $(".layerPop1").attr("tabindex", 0).show().focus(); $.. 더보기
[모바일]레이어 팝업 띄운 후 바디 스크롤 막기 레이어팝업을 띄우면 가끔 뒤에 스크롤은 안되게끔 막아달라는 고객님들이 계신다. 고객님은 갑님이시니까 무리가 가지 않는 선에선 원하는대로 다 해드린다. 하지만 잘 모르시는 분들을 위해 아래 소스를 남깁니다! 12바디 스크롤 막기 : $("body").bind('touchmove', function(e){e.preventDefault()});바디 스크롤 해제 : $("body").unbind('touchmove');Colored by Color Scriptercs 더보기
일정 스크롤 내리면 fixed 시키기 12345678910111213if(jQuery("footer").offset().top - jQuery(window).height() + 30 더보기
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 더보기
[플러그인] 제이쿼리로 곡선 모션 표현하기 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 더보기