본문 바로가기

Local Oriented

 (251)
iOS 에서 alert 와 confirm 작동 오류..? iOS 의 사파리 웹브라우저에서는 alert 와 confirm 이 modal 로 작동하는데, iOS 에 설치된 특정 앱에서는 alert 와 confirm 이 modaless 로 작동하기도 하네요.. 무슨 말이냐 하면, alert 나 confirm 이 실행되면 화면이 멈추고(block) 사용자가 확인이나 취소를 터치한 후에 다음 코드가 실행되는 것이 기존 프로그래밍의 흐름인데, 마지막 코드까지 모두 실행되고 화면에는 거꾸로 표시가 되는... 마치, 영화 테넷을 보는 듯한.. ㅠ. 아직도 감이 안 잡히신 분이라면.. alert(1); alert(2); 이라고 순서대로 자바스크립트가 세팅되면.. 1이 세팅된 알림창이 먼저 열리고 (확인 버튼을 누르면 1 알림창은 닫히고), 2가 세팅된 알림창이 나중 열리는 (..
모바일 기기에서 iframe 없이 youtube 영상 자동재생 유튜브 정책에 의해, 자동 재생(autoplay) 은 묵음(무음, mute) 상태에서만 가능. 기본 세팅은, 썸네일을 클릭했을 때 재생되면서 음원도 들리는 방식. 유튜브 사이트가 아니라, 내 사이트에 유튜브 영상을 embed 하면서, 화면이 열릴 때 바로 재생(play) 가 되게 하려면.. 상기와 같이 iframe 을 사용하면서 autoplay=1&mute=1 이라고 세팅하면 되는데.. PC 에서는 잘 되지만, 모바일 기기에서는 작동하지 않아요. 사실은, iOS 가 들어간 모바일 기기에선 작동하고, Android 가 들어간 모바일 기기에선 작동하지 않는거. 자, 여기서 부터가 오늘 이야기 하려는 내용. 모바일 기기(iOS 와 Android 모두)에서도 작동하게 하려면 YouTubeIframeAPI 를 사..
[carouFredSel] 가변폭 요소들이 슬라이드 될 때 가운데 정렬하는 방법 * jquery.carouFredSel-6.2.1-packed.js www.jqueryscript.net/demo/Circular-Responsive-Slideshow-Plugin-carouFredSel/ ul - li 구조로 오른쪽에서 왼쪽으로 움직이는 슬라이드 쇼를 구현할 때, carouFredSel 을 사용해 보세요. $('#ul_태그에_대한_아이디').carouFredSel({ auto:{ pauseOnHover:'resume'}//최초 슬라이딩, 마우스 커서가 올려지면 일시 멈춤, 커서가 벗어나면 슬라이딩 재개 //마우스 커서 움직임과 상관없이 슬라이딩 하려면 auto:true 하면 됨 ,scroll:1//li 가 scroll 갯수만큼 움직임, 2 라고 세팅하면 한 번에 2개의 li 가 움직임...
자바스크립트 데이타 최적화....? - 자바스크립트 기본원리 : Shape (Mozilla 의 SpiderMonkey 에서 사용되는 용어) 와 ICs(인라인 캐시) o shlrur.github.io/javascripts/javascript-engine-fundamentals-shapes-and-Inline-caches/ o meetup.toast.com/posts/78 참조 (내용이 겹친다 싶으면, 아래로 스크롤 해서 결론 부분만 읽어 보심이..) o engineering.huiseoul.com/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EB%8A%94-%EC%96%B4%EB%96%BB%EA%B2%8C-%EC%9E%91%EB%8F%99%ED%95%98%EB%8A%94%EA%B0%80-..
css 와 javascript 의 문자셋 .css 는 파일 상단에 charset 을 세팅할 수 있다. javascript 는 script 태그의 옵션에 charset 을 세팅할 수 있다.
chartjs-plugin-datalabels 그래프 모든 라벨 동시에 표시 CharJS 의 사용법과 옵션은 www.chartjs.org 에 가면 다 나옵니다.. 참고 바랍니다. ^^; 여기서 다룰 것은, chartjs 에서는 툴팁이 마우스 커서를 올려야(hover) 표시되는데.. 모바일 기기에서는 이게 안 되잖아요. 그러니 차트가 그려질 때, 숫자가 모두 보여져야 한다는 거구요. 이걸 해결하기 위해 chartjs 용 플러그인으로 datalabels 를 사용하는 겁니다. 일단 chartjs-plugin-datalabels.netlify.app 를 방문해서 참고하시고.. datalabels 플러그인을 세팅하면 그래프 안에 수치가 주욱 들어갑니다. 그런데, data set 에는 수치로만 넣어야 하기 때문에.. 수치에 대한 단위라든가, 천자리 쉼표 처리는 datalbels 의 form..
자바스크립트 테스트용 에디터 웹사이트 https://jsfiddle.net/vtepw9zw/3/ HTML/CSS/Javascript 등에 대하여 간단하게 사용할 만한, 그러나 기능은 상당히 만족스러운 에디터.. 그것도 웹사이트에서 이런 기능을 제공하네요. HTML DOM 에 대한 console.log() 내용도 모두 보여줍니다. 간단하게 테스트 하려고, 에티터 켜고 웹브라우저 켜고, 개발자도구 켜고 이럴 필요 없이.. 상기 웹사이트에 접속해서 체크해 보세요.
자바스크립트 개체 GC 자바스크립트에서 생성한 개체를 필요가 없어진 시점에서 강제로 GC (가비지 컬렉트) 할 수 있을까..? 개발자가 임의로 GC 를 작동하게는 할 수 없지만, 해당 개체를 null 처리 함으로써 GC 의 빌미를 제공할 수는 있다. 자바스크립트 변수 생성시 var 를 적용하지 않으면, 모두 전역변수로 설정되면서 화면이 바뀌기 전까지는 메모리를 점유하게 된다. 따라서, 루프 안에서 var 를 사용할 지 루프 밖에서 var 를 사용할 지.. function 안에서 사용할 지, function 밖에서 사용할 지 고민할 필요가 있다. var dom = ''; for( ... ){ dom += '...'; } $('#id').html(dom); dom = null; // 이렇게 null 처리 한다. 물론, 속도를 위해..

티스토리툴바