웹퍼블리셔를 위한/자바스크립트 팁12 자바스크립트 http → https 리다이렉트 소스 리눅스에서는 htaccess 파일을 수정하여 https로 리다이렉트를 시켜면 간단하게 처리가 됩니다. htaccess 파일 수정 방법 : https://blog.naver.com/chopie80/222464279326 하지만 타서버는 이 방법이 적용되지 않고 각 서버에 맞는 방법을 적용해야 하는데요 얼마전 node.js 호스팅에서 리다이렉트를 시키기 위해 express 프레인워크 작업을 하는데... 뭐가 문젠지...죽어도 안되더라구요... 그래서 아래 포스팅대로 자바스크립트로 클라이언트단에서 처리를 하였습니다. 약단 찝찝하긴 하지만... 별 문제는 없을 것 같습니다. https://blog.naver.com/chopie80/222464279326 http → https 리다이렉트, 자바스크립트로 처리하는.. 2021. 8. 10. 아주 간단한 심플한 '햄버거 메뉴' 코드 소스 입니다. 이렇게 삼선 햄버거 메뉴버튼을 누르면 전체 메뉴가 펼쳐지는 네비게이션입니다. css로 모양과 에니메이션 효과를 구현하고 아래와 같이 간단한 자바스크립트 코드 한줄로 함수를 만들었습니다. js_toggle.addEventListener('click',()=>{nav_menu.classList.toggle('nav-menu-open');}); 심플한 코드라서 바로 사용하기에는 좀 부족할 수 있지만 여기저기 활용하시기에는 아주 좋을 것 같습니다. https://designup4.tistory.com/11 햄버거 메뉴 네비게이션 (바닐라 자바스크립트 / CSS) 데모 : http://designup.kr/study/cssjs_togglemenu 소스 : https://github.com/designup/cssj.. 2021. 8. 1. 웹퍼블리싱 (css, 자바스크립트 등) 유튜브 강좌 영상 추천합니다. 저는 유튜브로 자바스크립트를 공부를 할때 한군데가 아닌 여러 채널의 강좌를 보고 있습니다. 그 이유는 저의 부족한 머리를 이해시켜주기에는 아무리 유명하고 뛰어나고 말을 잘하시는 강사님들도 다소 힘든 부분들이 있거든요. 과거에는 이해가 안되는 부분은 영상을 반복해서 학습을 하였는데 그것보다는 다른 강사님들의 설명을 듣다보면 이해가 안가는 부분이 쉽게 해결이 되더라구요. 그래서 저는 여러 채널의 강좌를 보고 있습니다. 오늘 추천해드리는 "코딩애플" 채널은 독특한 스타일의 강좌인데요~ 분명 이런 스타일의 강의가 맘에 들어하시는 분들이 있을 것 같아 추천드립니다. 아래 영상을 한번 참고해보시고 맘에 드시면 구독해보세요~ 2021. 5. 22. 좌에서 우로 색이 변하는 텍스트 효과 - 자바스크립트 바닐라 자바스크립트로 구현하는 왼쪽부터 오른쪽으로 글자색이 자연스럽게 변하는 텍스트 효과입니다. 2020. 8. 9. Javascript를 사용하여 반응 형 사이드 바 메뉴를 만드는 방법 HTML CSS 및 Javascript를 사용하여 반응 형 사이드 바 메뉴를 만드는 방법 | 대시 보드 사이드 바 메뉴 2020. 8. 6. CSS 및 Javascript를 사용하여 간단한 이미지 슬라이더 만들기 | 이미지 슬라이드 쇼 CSS 애니메이션 및 호버 효과 https://www.udemy.com/course/css-hover-animation-effects-from-beginners-to-expert/?referralCode=90A9FFA7990A4491CF8D 2020. 8. 4. 바닐라 자바 스크립트를 사용한 Mousemove의 배경 시차 효과 바닐라 자바 스크립트를 사용한 Mousemove의 배경 시차 효과 2020. 7. 31. 자바스크립트를 이용한 메뉴 활성화 애니메이션 [ Menu Hover Animation ] 순수 자바스크립트 vanilar javascript 마우스를 올리면 따라다니는 메뉴바 애니메이션 2020. 7. 28. 순수 자바스크립트 멀티 슬라이드, 하나씩 이동하는 슬라이드 구현하기 - 순수 자바스크립트(Vanilla Javascript)로 멀티 슬라이드 구현하기 2020. 7. 10. 유튜브 사이트 만들기 : YouTube API + HTML + CSS + JavaScript (full tutorial) Create a dynamic YouTube playlist app using HTML, CSS, Javascript and jQuery. 2020. 7. 3. 자바스크립트(fetch)를 이용한 유튜브 API DATA 다루기 ## 자바스크립트(fetch)를 이용한 유튜브 API DATA 다루기 "나의 유튜브 채널 "정보와 유튜브에 업로드한 동영상들을 웹사이트에 자바스크립트를 이용해 로딩하는 코딩 동영상입니다. ## github code : https://github.com/CodingDIY/youtube_api 2020. 7. 3. 반응형 이미지 팝업 - 자바스크립트 코드 작성 Fluid Image Pop Up Javascript Tutorial Fluid Image Pop Up Javascript Tutorial In today's episode we will learn how to do a basic but very important effect in javascript, which is a pop up modal for images. This is a very simple javascript modal effect so I highly recommend you to follow along. 2020. 7. 2. 이전 1 다음