제이쿼리 모바일 페이지 슬라이드
본문
<script src="/js/jquery-1.8.3.min.js"></script>
<script src="/mobile/js/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" href="/mobile/css/jquery.mobile-1.4.5.css">
<div id="page" data-role="page" data-add-back-btn="true">
<div id="panel" data-role="panel" data-display="push" data-position="left" data-theme="b">
<div class="closeBtn">
<a href="#header" data-rel="close" class="ui-btn ui-corner-all ui-shadow ui-icon-delete ui-btn-icon-left" data-mini="true">Close panel</a>
</div>
</div><!-- /panel -->
<div id="content" role="main" class="ui-content" style="padding-top:0;padding-left:0;padding-right:0;">
<a href="#panel"><img src='/mobile/img/panel_btn.jpg' height="20"></a>
</div><!-- /content -->
</div><!-- /page -->
안녕하세요, 다름이 아니라 제이쿼리 모바일에서 버튼을 누르면 새로운 페이지가 반 정도 튀어나오면서 주로 마이페이지로 사용되는 메뉴를 쓸려고 하는데요.
문제가 그 제이쿼리를 다른곳에 사용하고 있습니다. 두개를 같이 쓰니까 오류가 나서 수정을 여기저기 건드려봤는데 명확하게 되지가 않습니다.
저는 위의 소스를 독단적으로 쓰고 싶습니다. 방향도 아래에서 위로 올라오게끔 하고 싶은데,
어디를 수정하면 될까요
제이쿼리 고수분들 좀 알려주세요
답변 1
id를 서로 다르게 변경하고 jquery.mobile-1.4.5.css에 레이어 관련 위치가 있다면 class와 설정된 위치를 서로 다르게 변경해서 사용해야 합니다.
이전 사용중인 것과 겹치지 않도록 css와 id와 class 모두 서로 다르게 적용해주세요.
