코딩일기장 코딩일기장

참고한 영상 : https://www.youtube.com/watch?v=9WQBaQs1hC8 사진첩에 무한스크롤을 구현하기 위해서 위 영상을 시청했다. 영상속 방법은 간단했다 1. window.onscroll 함수로 스크롤 이벤트가 발생할때마다 함수를 실행함 2. window.innerHeight로 사용자가 화면에서 보는 높이(고정) + window.scrollY로 스크롤이 얼마나 이동했는지(변동)를 더하여 document.body.offsetHeight 보다 큰지 계산함.(즉 스크롤이 끝에 거의 도달했을때 실행됨) 3. toAdd이라는 변수에 document.createElement로 div 태그를 추가하고, toAdd.classList.add를 통해 클래스를 삽입하여 css가 적용되게 만들고, to..

생활코딩 PHP다운로드(윈도우) https://www.youtube.com/watch?v=WboIThLXOGg&list=PLuHgQVnccGMAMMNByX8Bf1BkVrShBhj1I&index=4 이미지속 유튜브 링크 https://www.youtube.com/watch?v=bG_PMkHuRao

1.gird를 이용해서 상단 타이틀박스가 페이지에 맞게 줄어들게 만들기 .title { width: 1205px; height: 65px; border-bottom: 0.8px groove rgb(255, 188, 188); color: rgb(255, 188, 188); display:grid; grid-template-columns: 1fr auto; } 발생한 문제> 오른쪽에 있는 업로드버튼이 페이지가 줄어들때 안따라옴 해결방법> 미디어 쿼리를 이용해서 페이지가 줄어들때 마다 +버튼이 이동할수있도록 타이틀 박스의 크기를 조정하엿음 @media (max-width:1180px) { .photoLayout { width: 1000px; } .line { width: 1000px; } .title { w..

1. 업로드 버튼 추가 + + 발생한 문제> 위쪽 코드는 내가 짠것, 아래쪽 코드는 웹사이트에서 긁어온 것이다. 실행시키니 내가짠 코드는 실시가 안되고 아래쪽 코드만 실시된다. 해결> 이유는 for를 input의 아이디에 일치시키지 않아서였다. label에 for문을 사용하려면 input태그의 id를 정확하게 가져와야한다. 2. 업로드 버튼 css먹이기 .uploadBotton { margin-top : 5px; box-sizing: content-box; display : block; float: right; color: rgb(254, 118, 118); width: 58px; height: 58px; cursor: pointer; font-size : 40px; text-align: center; ..

1.이미지 업로드 버튼 추가(230817 완) 2.상단바 고정, 페이지 조정시 상단바가 똑같이 줄어들게(grid로 선 자동조절기능) 만들기 (230818 완) 3.인스타그램처럼 밑으로 내리면 계속 사진이 뜨게 만들기 (231126 완) 4.사진 클릭시 사진에 대한 상세팝업이 나오도록 구현(날짜(230909 완), 댓글(230912 완) 5.관련된 데이터베이스 구축(이미지(230909 완), 로그인()) (php, mysql 공부 : https://opentutorials.org/course/3167 ) (3번 구체화 23.08.18) --> 3.무한스크롤 구현하기(231126완) (참고 : https://brunch.co.kr/@hyoi0303/39) (5번 구체화 23.08.27) -이미지를 백엔드 데..

Memories 만들면서 새로 알게된것들 1.구글 웹폰트 2.vs코드 rgb로 색깔지정 3.div를 통해 레이아웃 4.이미지 클릭시 페이지 이동 5.네이버블로그는 이미지주소복사로 이미지를 가져올수없음(그래서 티스토리로만듬..) 사진첩 주소 : https://h-love-j.netlify.app/