핸드폰메뉴만들기

페이지 정보

profile_image
작성자지모 조회 2회 작성일 2020-08-01 20:30:57 댓글 0

본문

스르륵 나타나는 사이드메뉴 만들기(스크립트 없이 HTML코딩강좌) input:checked(checkbox) -[HTML+CSS{코남}]

안녕하세요 HTML과 CSS로 비쥬얼 아트 코딩을 지향하며 코딩하는 남자 코남입니다.

이번강좌는 인풋요소의 checkbox타입을 사용하여
체크가 되었을때와 안되었을때의 상태 변화를 이용해서
사이드에서 메뉴영역이 자연스럽게 스르륵 나오는
효과에 대해서 코딩해보았습니다.

스크립트가 없이 최대한 단순하게 코딩하고
영상으로 표현하려 했지만 어려운 부분이있는 ...

사이드바로 사용할 div 는 input과 label 요소 다음에 있는데 input의 변화값을 사용하려면 인접요소 선택자인 +로 input에서 div 까지 연결해서 체크가 되었을때와 안되었을때의 스타일을 줌으로써 사이드바를 구현할 수 있습니다.

자세한 설명을 영상을 참조해 주시고요
영상에서 제작된 html파일은 블로그에서
다운받아서 직접 코드를 확인하실 수 있습니다.

-
본 코딩강좌가 도움이 되셨다면
좋아요와 구독하기 부탁드립니다.
문의사항은 이메일로 보내주셔도 됩니다.
-
B/블로그 : https://blog.naver.com/co-nam/221439353062
E/이메일 : co-nam@naver.com
Mingee Kim : 쵝오! 개발자 필수 영상...ㅎㅎ
오용현 : z-index를 사이드바가 아닌 체크박스에 넣어야 되지않나요?
HYEONJU YOU : 코딩이 어렵게 느껴질수있는것을 이해하기쉽게 설명되어 있어서 너무 좋아요^^ 영상 퀄리티 굿굿!!!
Harumichi Bouya : 와 찾고있었는데 정말감사합니다
CreamBread : 블로그에 있는 파일을 복붙하면 되는데 왜 제가 직접 작성하면 안되죠? 분명 다 맞게 썼는데.... + 오른쪽에서 사이드 바가 나오게 할때 아이콘은 움직이지만 검은색 사이드 바가 나오지를 않아요 ㅠㅠㅠㅠ 그리고 4:50초까지 div css 구문(?) 만 하면 하얀색 x 버튼이 안나와요
input[id="menuicon"]:checked + label {
    z-index:2;
}


input[id="menuicon"]:checked + label span {
    background:#fff;
}
이 구문을 추가해야더군요 ㅠㅠㅠ 블로그 보고 알았어요
수삐 : 감사합니다
pIxx : 정말 좋은 강좌들 감사합니다 :)
patienceee100 : 나만 알고싶은 채널이다....
대단하다 : ㅎㅎ 와~ 기가막히네요 보자마자 바로 구독 눌렀습니다. 다양한 기능 활용도 많이 올려주시길 바라겠습니다. 코딩 구독 20개가 넘게 있지만 탑으로 올라오셨네요 최고입니다.
딸기참치 : 막막해서 멍때리고 있다가 코남님 컨텐츠 보고 정신차렸어요! 보는내내 너무 쉽고 간단하게 알려주셔서 감탄했어요 감사합니다 다른영상도 많이많이 올려주세요:) 근데 혹시 제이쿼리 쪽은 하실생각이 없으신지..?

시동만 걸면 자동실행되는 티맵 네비게이션 만들기 / 네비 자동실행 자동종료 / 남는 스마트폰 공기계 활용

시동을 걸면 네비게이션이 자동실행되고 시동을 끄면 자동종료 됩니다.
티맵 뿐만 아니라 카카오내비, 네이버 내비게이션 등 모든 네비 앱이 적용 가능합니다.
안쓰고 남는 스마트폰이 있다면 자동실행되는 네비게이션으로 활용해보세요~^^

#네비자동실행 #티맵자동실행 #스마트폰네비

★ 구독 \u0026 좋아요 \u0026 이쁜댓글 \u0026 공유는 곰세를 행복하게 합니다
★ 구독자 \u0026 시청자 여러분 영상 재미있게 봐주셔서 항상 감사하고 모두 사랑합니다
sforea : kt 알뜰폰 요금제 중에 데이터 무제한 요금제 쓰면 유심 2개까지 데이터 무료 공유 됨(유심 구매는 해야 됨)
오늘은이거다 : 네비고장나서 새로 살려고했었는데 안쓰는 공기계에 핫스팟써서 차에 두고 네비로 써야곘네요. 시동걸면 자동으로 티맵되니까 충분히 가능할듯. 배터리는 항상 충전되도록하구..
김수현 : 네비게이션 활용을 잘하고 있습니다..덕분에 그런데 질문이 있습니다.시동을 끈후 자동으로 네비가 꺼져야 하는데 꺼지지 않고 계속 켜져있어 밧데리가 거의 소모되어 버립니다..왜 그런지 모르겠어요.ㅜㅜ 설정을 잘못한걸까요?
박남수 : 나는갤럭시노트2인게. 공기기를. 해도. 공기기가 안켜지네요
kalisoki him : 데이터 쉐어링하면 편합니다.
플라이하이 : 낚엿네...공기계스마트폰있어야 되네
오광해 : 유심칩상션어떻게사용하나요
오광해 : 공기계가오프라인이라는데 온라인은어
떻게하나요
이영옥 : 공기계 사용할수있어 아주 ~~좋아요
하성호 : 영상보고 해봣는데 좋은데 문제가 노는핸폰이라 계속거치해 놓으면 핸폰 베터리가 ㅠㅠ
치량매립네비는 언제나 시동켜면 작동되는데.
휴대폰에 계속전원을 공급해줄수는 없나요.ㅎㅎ

남는 스마트폰으로 무료 CCTV 만드는 방법

집에 남는 스마트폰으로 CCTV를 만드는 방법입니다
구글 계정만으로 간단하고 쉽게 무료로 만들수 있습니다
영상에 스마트폰 광각렌즈는 아래 링크에서 구입하실수 있습니다
https://coupa.ng/blUXZu
럭키보이 : 이거 같은 계정으로 해야 하나요?
김기창 : 하루에 두번정도5분씩보면 10분정도데이터만 나가는건지요?
이재천 : 네비게이션 도가능한가요
이정빈 : 거실하고 ㅣ현관에ㅣ 폰두개설치할려면 구글 같은계정으로 사용해서 폰으로 볼수있나요
태희 : 영상보고 어플설치똑같이하고 했는데요
제차에타면 자동적으로 블루투스연결이되어서 화면을 볼수가없어요 어떻게하면되나요?
Farmland Tiger : Alfred camera 앱 광고네
Kim코난 : 와우 대박
고맙습니다
중고폰 사이트에 팔려고 생각했는데

내가 써야겠네요
we tubeon : 조감독님 A+++++★ 좋은 정보 주셔서 무지무지 감사합니다. 저도 카메라 종류를 많이 실험을 해보고 있습니다 로지택은 움직임녹화 기능이 매우 좋으나 PC에 연결해야하고, 샤오미는 휴대폰으로 볼수있는데 움직임녹화가 어설프고, 브이스타캠은 에러와, 움직임 녹화기능이 부실하고 중국에서 백도어로 해킹과 수시로 통제를 합니다. TP-Link는 기능은 쓸만한데 좀 비쌉니다. 움직임 녹화기능이 좋은 모델은 움직이기 전부터 움직임이 완전 끝날때 까지 녹화되는 기능이 좋아보였습니다. 휴대폰 공기계 CCTV 프로그램중에서 조감독님께서 추천해주신 어플이 제일 좋았습니다.
감사합니다.
카라얀 : 그글 계정이 같아야 하나요?
DW Lee : 와이파이, 아님 뭔가의 연결하는 것이 뭐죠?

... 

#핸드폰메뉴만들기

댓글목록

등록된 댓글이 없습니다.

전체 528건 1 페이지
게시물 검색
Copyright © www.bwaterdiver.com. All rights reserved.  Contact : help@oxmail.xyz