너비 등으로 사용자 정의 JQuery 슬라이드 아웃 문제

Question

저는 JQuery보다 HTML/CSS 사람이 더 많습니다. 나는이 개념을 한동안 구축하는 데 어려움을 겪고 있습니다. 내가 그것을 psuedo-plugin으로 자유롭게 풀 수 있도록 끝내고 싶다. 나는 약간의 지침을 줄 수있는 사람을 기쁘게 생각하며, 대부분 거기에 있다고 생각한다.

---

첫째, 내 데모는 http://demindu.com/sandbox/이다.

---

문제 : 내가 백분율로 정의 된 높이를 얻으려고 노력하거나 슬라이드 아웃이 가능한 한 많은 공간을 사용하도록 window.innerHeight 등을 사용하고
1). 현재 높이는 &이며 CSS에서는 px로 정의됩니다.

2) 당신은이 페이지의 하단에 링크로 표시의 오른쪽에 나중에 탭 중 하나를, 그리고 탭을 클릭하면 것을 알 수 있습니다. 이는 각 링크가 오른쪽의 탭을 완전히 덮어야하기 때문입니다. 나는 이것을 절대 할 수 없었습니다. 절대 위치 지정 등의 일을 시도했습니다. 나는 아이디어가 부족합니다.

---

나를 위해 만든 모든 것을 가지고하지,지도를 찾고 있어요. 이 경우에는 더 이상 조사를 시작하지 않을 것입니다.

는 일부 공간을 저장하려면
JS : http://demindu.com/sandbox/js/slideout.js
CSS : http://demindu.com/sandbox/css/style.css
HTML : 분명히 브라우저에서 볼 수 있습니다.

---

편집 # 1 : 아래 Matt의 충고에 따라 올바르게 높이 평가했습니다. 그러나 각 콘텐츠 탭의 너비를 백분율로 설정할 수는 없습니다. 내부 너비의 계산을 기반으로 px에서 너비를 설정할 수 있다고 생각하지만 내 div가 이미 그 너비 일 때 조금 해킹 것 같습니다. 100 %로 설정하면 탭이 브라우저 너비 이상으로 벗어납니다.

난 아직도 선택한 탭의 오른쪽에있는 탭을 점점 데 다른 문제는 그래서 그들은 단지 아래의 하위 메뉴에 표시 사라집니다. 어떤 아이디어? 기본적으로 각 탭은 같은 위치로 미끄러 져 나갈 것이라고 생각했습니다. 당신이 jQuery를 사용하는 경우

Answer 1

당신이 선택한 탭 후 탭의 표시를 전환 할 수 있어야한다. 하단 nav는 float : left이고, 이것을 변경하고 전체 UL을 main nav ul과 동일한 div로 가져 오는 것이 좋습니다. 그런 다음 바로 플로팅하고 원하는 효과를 얻을 수 있어야합니다.

메인 UL과 같은 사업부에 바닥 UL을 가져올 경우 상대적으로 그 DIV의 위치를 ​​설정하고 절대적으로 아래로 아래 UL을 펼쳤던 시도 할 수 : 0. 그렇게하면 항상 래퍼 div의 맨 아래에있게됩니다.

나는 여러분이 성취하고자하는 것이 완전히 가능하다고 생각하며 올바른 길로 나아갔습니다.

몇 가지 아이디어가 도움이 될 것입니다.