Front-End/JavaScript 3

[JavaScript] IE에서 Audio 사용하기

chrome, edge, firefox등 최신 업데이트 되는 브라우저들은 Audio 태그 만으로도 고유의 플레이어가 생성됩니다. 업데이트되지않는 IE같은 경우는 Audio태그가 작동하지 않는 경우가 있는데 그경우 사용할 JavaScritp코드입니다. 기본적으로 object 태그를 이용합니다. value 값에 사용할 파일 위치, URL을 사용합니다. 1. object 태그 직접 사용 1 2 3 4 5 6 7 8 9 10 11 12 13 Colored by Color Scripter 2. jQuery 사용 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 // DOM // script function fileToAudioObject(src){ v..

[JavaScript] 이미지 파일 리사이징

웹 페이지에서 서버로 이미지 파일을 올려주기 전 이미지의 크기가 클 경우 리사이징 후 파일을 올려주고자 한다. 서버단에서도 조정할 수 있지만 서버에 무리가 올수 있기에 클라이언트단에서 처리하는 것이 좋다고 한다. 아래 두 주소는 코드를 참고한 사이트이다. https://stackoverflow.com/questions/23945494/use-html5-to-resize-an-image-before-upload https://codepen.io/tuanitpro/pen/wJZJbp 하단의 코드는 전체 소스코드이다. 이 코드는 파일이 resizing 됐는지 확인하기 위한 코드이며 메모장으로 .html로 저장하여 간단하게 확인할 수 있도록 upload부분은 제외하였다. (file 크기확인은 f12 개발자모드 ..

[JavaScript] 달력 만들기

javascript, jQuery, DOM, CSS 활용 자바스크립트를 공부하며 간단한 달력(Calendar)을 만들어 보았습니다. 주로 자바스크립트로 생성하기 위해 HTML은 최소한으로 사용하였습니다. 아래는 전체 소스코드(간단히 메모장에 text.html로 저장해도 확인가능) 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161..