facebox (jQuery 플러그인) 대화 상자의 하단에 "바닥 글"을 붙이는 방법

Question

콘텐츠가 포함 된 대화 상자를 만들고 나머지 페이지를 차단하고 페이드 아웃하려면 jQuery 플러그인 인 Facebox을 사용하고 있습니다. 고정 된 크기 대화 facebox있는에 내가 계획

<a href="remote.html" rel="facebox">Open Facebox Dialog</a> 

을하고 facebox 결국 액세스 스크롤 필요가 내용이됩니다

이 플러그인은이 같은 레이아웃으로 외부 HTML 페이지를 적용 할 수 있습니다.

그러나, 나는 또한 내용의 일부 항상 "고정 된 바닥 글"처럼 바닥에 고정하는 방법을 원한다.

나는 (I은 전체 페이지를하고 싶었던 경우 작동합니다 : fiddle) Joseph Silber's solution을 적용했지만, 그것은 페이지 하단에 대화 상자 외부에 고정 된 바닥 글을 넣습니다 :

http://jsfiddle.net/c82ha/2/

이 제대로 바닥에 고정한다, 그러나 당신이 그것을 아래로 스크롤하기 전에 바이올린에서 볼 수 있듯이,이 표시되지 않습니다 :

나는이 같은 제안하는 RegDwight's solution을 적용했습니다.

나머지 페이지의 스크롤 또는 크기에 관계없이 하단에 을 고정시키고 싶습니다..

어떻게하면됩니까? 관련

---

는 :

• Make div stay at bottom of page's content all the time even when there are scrollbars
• CSS Push Div to bottom of page

Answer 1

당신은 절대 위치로 대화 내부의 바닥 글을 봤나?

HTML

<div class="dialogue"> 
    <div class="content"> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
     <p>Text</p> 
    </div> 
    <div class="footer"> 
     Footer 
    </div> 
</div> 

CSS

.dialogue{ 
    width: 200px; 
    height: 500px; 
    position: relative; 
    background: red; 
} 
.dialogue .footer{ 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    background: #000; 
    color: #fff; 
} 
​ 

jsFiddle