2014-03-13 2 views
0

캔버스 벗어난 푸시 바닥 글을 작성하려고합니다.
바닥 글 메뉴에서 다른 옵션을 선택하면 나머지 페이지가 바닥 글 내용을 표시하기 위해 위로 올라옵니다.
슬라이드 바닥 글 메뉴 here에 대한 자습서가 있지만 [footer] 내용을 슬라이드하기 때문에 페이지 상단의 (맨 위 레이어에서와 같이) 이것은 내가 찾고있는 것이 아닙니다.

"아코디언"부트 스트랩을 사용하여 페이지 아래에 콘텐츠가 드롭 다운되었지만보기 영역 (브라우저 창)을 벗어나기 때문에 일부 방문자가 찾지 못할 수도 있습니다. 여기캔버스가 아닌 푸시 바닥 글

FIDDLE

<div class="pushDown">Please scroll down to bottom</div> 
<div class="panel-group" id="accordion"> 
<div class="panel panel-default"> 
<div class="panel-heading col-xs-6"> 
    <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> 
     Collapsible Group Item #1 
    </a> 
</div> 
<div class="panel-heading col-xs-6"> 
    <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> 
     Collapsible Group Item #2 
    </a> 
</div> 
</div> 
<div class="panel panel-default"> 
<div id="collapseOne" class="panel-collapse collapse"> 
    <div class="panel-body"> 
    CONTENT 1 
    </div> 
</div> 
<div id="collapseTwo" class="panel-collapse collapse"> 
    <div class="panel-body"> 
    CONTENT 2 
    </div> 
</div> 
</div> 
</div> 

는 패널이 떨어지는 대신 내용의 나머지 부분을 밀어 가지고 어쨌든 있나요입니까?

옵션 2 - 내가 필요로 여기에 내가 Christopher Yee's plugin을 쥐게 한이 행동하지만 난 단지 그것을 내가하고자하면 내가 JS를 편집하는 방법을 하나 개의 버튼

PushFooter

$(function() { 
var pushy = $('.pushy'), //menu css class 
    body = $('body'), 
    container = $('#container'), //container css class 
    push = $('.push'), //css class to add pushy capability 
    siteOverlay = $('.site-overlay'), //site overlay 
    pushyClass = "pushy-left pushy-open", //menu position & menu open class 
    pushyActiveClass = "pushy-active", //css class to toggle site overlay 
    containerClass = "container-push", //container open class 
    pushClass = "push-push", //css class to add pushy capability 
    menuBtn = $('.menu-btn, .pushy a'), //css classes to toggle the menu 
    menuSpeed = 300, //jQuery fallback menu speed 
    menuWidth = pushy.width() + "px"; //jQuery fallback menu width 

function togglePushy(){ 
    body.toggleClass(pushyActiveClass); //toggle site overlay 
    pushy.toggleClass(pushyClass); 
    container.toggleClass(containerClass); 
    push.toggleClass(pushClass); //css class to add pushy capability 
} 

작업을 얻을 수 있습니다 클래스 이름을 사용하십시오 .pushy-left2.menu-btn2.pushy2

답변

0

꼬리말의 내용 영역에 #id 막대기를 만들고 th 아코디언의 방아쇠.

해당 링크가이 'A HREF = "mysite.com/home#article"'

이 때문에 정보의 조각에

+0

당신이 할 말을 페이지를 중심으로 콘텐츠 영역에 링크하기를 클릭하면 앵커 링크? – no0ne

+0

멍청하다. 작동 할 것이라고 생각한다. – jurjen

+0

이미 시도했지만 "href"가 이미 "토글"기능으로 사용 중이므로 올바르게 작동하지 않을 것인가? 실례로 제 '바이올린'을 업데이트 할 수 있습니까? – no0ne