Web Study

1. 탑바 광고 배너를 이미지로 넣어줬더니 앱솔루트 한 부분이랑 겹치는데, background-image로 깔아주니 겹침 현상이 없어졌다. min-width 때문인 것 같은데, 일단 해결은 됐지만 다시 한 번 확인을 해봐야겠다. 2. 자바스크립트 사용시 같은 명령어를 여기저기 동시에 넣어줬는데 (ex.스크롤 할 때 배너 광고 없어지기 + 클릭했을 때 없어지기) 클릭했을 때 영원히 닫히지가 않는다. 그래서 이름만 바꿔서 다른 명령어를 넣어주니 잘 된다. 컴퓨터도 이럴땐 혼동이 되는건가. 아무튼 css한 줄 더 쓰더라도 좀 더 구체적인걸 요구하는 것 같다. 3. 배너 이미지, 체크박스, span 요소를 동일 선상에 정렬하는데 시간이 생각보다 많이 걸렸다. span태그가 inline요소라서 정렬 상태가 애매해..

고정 너비가 있는 적응형 사이트 1.로고가 가운데 박혀 있는 예제. 특이한게 메뉴와 메뉴 사이에 있네? 일단 메뉴 아이템의 일부로 로고를 넣어주고 작업을 했고 여기까지는 순탄하게 됐던 것 같다. 그런데 로고에 마우스 오버시에는 서브 메뉴 오픈이 안되게 되어 있다. 여기서 당황을 한 것 같다. 일단 hover로 최대한 어떻게 해봤는데 메뉴 아이템에 호버 했을시 서브 메뉴가 나오다가 끊겨 버린다던지, 상위 클래스에 호버를 걸어주면 이게 로고가 선택 되어 버리는 문제가 생긴다. 여기서 자바스크립트를 써야 겠다고 생각하고 사용 했는데, 뭔가 또 잘 안된다. 그냥 단순히 로고가 선택이 안되게끔 스크립트를 걸어주면 되는 거였는데, 너무 복잡하게 생각한 것 같다. 어쨌든 문제는 간단하게 해결 됐다. 2. 본아이에프 ..

이번 경우에는 작업을 두 번 나눠서 진행 하였다. 크게 다를 건 없지만 처음에는 유지, 보수 후 버전으로 작업을 시작해서 그대로 마무리 짓고 싶었고 그 이전에 사이트 형태도 한 번 다뤄보고 싶어서 html은 공유를 하고 나머지를 수정 하였다. 생각보다 왜 오래 걸렸는지 잘 모르겠다...ㅠ 일단 작업하면서 뭔가 계속 문제가 생기고 할게 많아지고 이런 부분은 애초가 뭔가를 잘 못 해서 그런 것 같다는 생각이다. 1. 일단 배경을 분리 한다는건 딱히 차이점이 별로 없는 작업인 반면에 배너 광고 하나 넣어주는 것은 생각보다 손이 많이 가는 작업인 것 같다. 배너 광고를 닫았을 때 다른 부분은 어떻게 되며, 스크롤이 되었을 때 바뀌는 점, 또 스크롤을 다시 다시 올렸을 때 바뀌는 부분 등을 고려를 해야한다. 2...

문제가 많이 발생됐던 어려운 예제 였던 것 같다. 어떤 효과를 주는 것은 제외하고 구조적인 부분은 순탄하게 됐던 것 같은데... 작업을 하면 할 수록 문제가 생가더니 거의 기존 탑바 클론 코딩 작업 시간 보다 두배정도? 소요된 것 같다. 일단 처음에 사이트만 보고 작업을 하였는데, 그 부분도 시간 지연에 영향이 컸던 것 같다.(덕분에 공부는 정말 많이 된 것 같다) 원래 사이트에서 현재는 탑배너 광고를 꺼두었는데 개발자 도구로 뒤늦게 확인한 부분도 있고...그래서 사이트와는 다른 방향으로 작업하게 됐던 것 같다. 사이트에서는 탑바와 마우스 오버 했을 때, 서브 메뉴의 배경을 한 번에 덮어주는 방식으로 했고 나는 탑바의 주메뉴와 서브 메뉴를 따로 따로 분리해서 작업하는 방식으로 하였다. 내 작업물은 탑바의..

오늘 작업에서는 크게 느낀점은 없는데, 잘 진행되다가 탑바의 밑줄을 긋는 작업을 하다가 시간을 엄청 잡아 먹었다. 밑줄이 있고 그 밑에 작은 높이의 여백이 있는 상태 였는데, 탑바의 크기는 밑줄까지만 포함되고 있었다. 암튼 그래서 이 선을 마우스로 갖다 댔을 때 서브 메뉴 호버가 풀리는 현상이 있는데, 선이 완전 바텀 부분이 아닌 중간에 오니 무슨짓을 해도 이 현상을 해결할 수 없었다. 근데 그 여백의 크기가 알고 보니 백그라운드 이미지 였던것..! 정말 쓸데없는걸로 시간을 많이 낭비 한 것 같다. 개발자 도구를 좀 더 면밀히 봤어야 했었나.. 나름 집중하고 있었던 것 같은데. " target="_blank" rel="noopener">codepen.io/issue72y/pen/xxEQrRx"> See ..