W3C 조직( www.w3c.org )에서 정의한 새로운 HTML 4.0 사양은 모든 웹 디자이너에게 더 강력한 도구를 제공합니다. 이는 과거에 많은 사람들이 생각했던 동적 효과에 영향을 미치는 변화입니다. 상상할 수 없는 일이 이제 DHTML과 CSS의 도움으로 쉽게 달성될 수 있습니다. 다음은 웹 페이지 편집 프로세스 중 일부 효과 구현에 대한 자세한 설명입니다. 이를 사용하여 웹 페이지에 활력을 불어넣을 수 있기를 바랍니다.
* 메뉴 기술
Microsoft 및 Macromedia 사이트를 방문한 사람들은 메뉴 기술을 분명히 발견할 것입니다. 클릭하면 하위 메뉴가 표시되고 다시 클릭하면 하위 메뉴가 숨겨집니다. 저자는 이 두 페이지를 각각 다운로드했는데, 소스 코드를 분석한 결과 동일한 방법을 사용하지 않았으며 두 방법 모두 각각의 장단점이 어떻게 구현되어 있는지 살펴보겠습니다.
Macromedia는 다중 페이지 기술을 사용합니다. 즉, 먼저 확장된 항목 없이 기본 메뉴 페이지를 만든 다음, 확장된 각 기본 메뉴 항목에 대한 페이지를 만드는 것입니다. 기본 메뉴의 항목 수에 해당하는 데 필요한 하위 페이지 수입니다. 설명하기 위해 간단한 예를 들어보겠습니다.
여기를 클릭하세요!
목록 1
목록 2
목록 3
그림 1에서 Click here!를 클릭하면 그림 2의 효과가 나타납니다. 구체적인 구현 과정에서 태그의 정의와 사용에 주의를 기울여야 하며 일대일 대응을 달성해야 합니다. 그렇지 않으면 혼란스러울 것입니다. 또한, 메뉴 항목이 많을 경우에는 현재 나열된 하위 메뉴만 으로 정의하고, 다른 주 메뉴 항목은 해당 확장 페이지로 연결해야 한다는 점을 기억하세요.
이 방법은 구현이 매우 간단하고 일반 사람들이 빠르게 익힐 수 있으며 모든 브라우저에서 지원될 수 있지만 단점도 분명합니다. 우선 속도가 느리고, 페이지를 왔다 갔다 하면 필연적으로 오랜 시간이 걸릴 수밖에 없습니다. , 하나씩 생산하는 것이 조금 번거롭습니다. 따라서 이 기술에는 여전히 특정 제한 사항이 있습니다.
Microsoft는 DHTML 기술을 사용합니다. DHTML은 비교적 새로운 기술이므로 일부 "오래된" 브라우저의 경우 이 메뉴 구현 방법은 쓸모가 없습니다.
설명하기 위해 예를 들어 보겠습니다.
그림 3과 같이 Product & Services를 클릭하면 바로 아래와 같은 메뉴가 나타나며, 다시 클릭하면 사라집니다. Macromedia와 동일하지만 소스코드가 훨씬 빨라진 것 같습니다. .
<본문>
<스크립트 TYPE="텍스트/자바스크립트">
function clikker(a,b) {
if (a.style.display ==') {
a.style.display = 'none'
b.src='usm.gif'
}
else {
a.style.display='; ;
b.src='dsmh.gif';
}
}
