WebProgramming 썸네일형 리스트형 HTML 펼침목록 태그 using JavaScript 저번 포스팅(HTML 펼침목록 태그)에서는 오로지 HTML만을 이용해서 펼침 목록을 만들었는데요, 이게 사용도 힘들고, 매번 비슷한 내용을 기입해야 해서 JavaScript를 이용해서 될 수 있게끔 고쳤습니다. 물론 제가 포스팅 하는 과정에 있어서 사용하는 기능을 적는 거라 해당 내용도 팁으로 적어 볼 까 합니다 :) 문서의 구성 일단 여러가지 상황에 대해서 제대로 나오는지 확인을 해봐야 하니까, 아래와 같은 내용의 문서를 임의로 만들었습니다. 펼침목록을 구성하면서 가장 보기에 좋지 않은 것이, 스크롤링이 마음대로 되는 거 때문에 여러가지 테스트를 하면서 이 포스트를 작성하는 거에요. 열고 닫았을 때, 다시 원래의 "열기" 버튼이 있는 곳으로 제대로 이동되면 성공! JavaScript 함수 삽입 HTML.. 더보기 HTML 펼침목록 태그 다른 태그들도 전부 확인해 보지는 않았지만 보이고 안보이는 것과 관련되는 것은 div 태그로 묶어야 하는 듯 합니다.ㅠ 제가 할 내용은 아래와 같습니다. "펼치고/닫을" 본문이 있다. "펼치고/닫을" 버튼이 있다. 블로그에 후딱 후딱 쓸 내용인데 버튼까지는 단순히 텍스트 클릭으로 만들거에요. 그럼 필요한 div 원소는 3개가 필요하겠죠? 펼치는 거 닫는 거 본문 초기에 본문을 보이게 할 것인지, 안보이게 할 것인지는 직접 정할 문제지만 일단은 그거에 맞게 다른 버튼들도 보이고 안보여야 겠죠? 그건 아래와 같습니다. 본문이 보인다 == (이미 본문이 펼쳐졌으므로)펼치는 버튼은 안보인다 / 닫는 버튼이 보인다. 본문이 안 안보인다 == 펼치는 버튼이 보인다 / (본문이 이미 닫혀있으므로) 닫는 버튼은 안보인.. 더보기 Install Apache 다운로드 Apache site 설치 거의 그냥 Next만 누르시면 됩니다. 아래의 설치 캡쳐 화면을 따라 가시면 됩니다. 신경 쓰지 마시고 그냥 Next! 웹서버의 루트가 될 경로가 있습니다. 아래에서 다시 설명하도록 하겠습니다. 실행 설치할 때 입력한 설치 경로로 이동하게 되면 해당 디렉토리 하부에 htdoc이라는 디렉토리가 있는데, 이곳이 apache server의 루트 디렉토리가 됩니다. 설치 시 기본 경로 : C:\Program Files\Apache Software Foundation\Apache2.2 서버 루트 경로 : C:\Program Files\Apache Software Foundation\Apache2.2\htdocs 하부에 기본 html 파일이 하나 있는데 단순히 잘 작동하는지 보는.. 더보기 IMG tag IMG TAG 정의 태그는 html 페이지안에 이미지를 삽입 할 수 있는 태그 입니다. 다른 부가적인 attributes 들이 있지만, src와 alt는 필이 입력해 주셔야 합니다. HTML과 XHTML 에서의 IMG 태그의 차이점 HTML : end tag()를 붙이지 않아도 됩니다. XHTML : end tag를 필요로 합니다. Required Attributes Attribute Value Description alt text 이미지를 표현 할 수 없을 때, 대체되는 텍스트 src URL 이미지의 경로 Optional Attributes Attribute Value Description align top bottom middle left right style안에 포함 이미지를 정렬 border pi.. 더보기 이전 1 다음