2013-04-14 2 views
1

샘플에 따라 내 패널의 너비를 http://view.jquerymobile.com/1.3.1/dist/demos/examples/panels/panel-styling.html으로 설정했습니다. 모든 것이 잘되지만 바닥 글의 고정 도구가 머리글과 내용보다 더 많이 움직입니다. 이렇게하면 고정 도구 모음에서 패널까지의 간격이 생깁니다. 누구든지이 문제를 해결하는 방법을 알고 있습니다. 감사합니다. .고정 도구 모음으로 Jquery Mobile Panel 스타일링

+0

질문에 대한 자세한 내용을 입력하십시오. – 5ervant

+1

해결. 나는 .ui-responsive-panel.ui-page-panel-open .ui-panel-content-fixed-toolbar-display-push.ui-panel-content-fixed- toolbar-position-left를 추가해야한다는 것을 발견했다. CSS 파일에서. – user2279231

+0

그러면 자신의 질문에 답하고 올바른 대답으로 선택할 수 있습니다 .. – 5ervant

답변

1
#demo-page #left-panel.ui-panel { 
    width: 15em; 
} 
#demo-page #left-panel.ui-panel-closed { 
    width: 0; 
} 
#demo-page .ui-panel-position-left.ui-panel-display-reveal { 
    left: 0; 
} 
#demo-page .ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open, 
.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open, 
.ui-panel-dismiss-position-left.ui-panel-dismiss-open { 
    left: 15em; 
    right: -15em; 
} 
#demo-page .ui-panel-animate.ui-panel-content-fixed-toolbar-position-left.ui-panel-content-fixed-toolbar-open.ui-panel-content-fixed-toolbar-display-reveal, 
.ui-panel-animate.ui-panel-content-wrap-position-left.ui-panel-content-wrap-open.ui-panel-content-wrap-display-reveal { 
    left: 0; 
    right: 0; 
    -webkit-transform: translate3d(15em,0,0); 
    -moz-transform: translate3d(15em,0,0); 
    transform: translate3d(15em,0,0); 
} 
/* Reveal menu shadow on top of the list items */ 
#demo-page .ui-panel-display-reveal { 
    -webkit-box-shadow: none; 
    -moz-box-shadow: none; 
    box-shadow: none; 
} 
#demo-page .ui-panel-content-fixed-toolbar-position-left, .ui-panel-content-wrap-position-left { 
    -webkit-box-shadow: -5px 0px 5px rgba(0,0,0,.15); 
    -moz-box-shadow: -5px 0px 5px rgba(0,0,0,.15); 
    box-shadow: -5px 0px 5px rgba(0,0,0,.15); 
} 
관련 문제