我有一个固定页眉和固定页脚的页面.内容的高度也固定为窗口的高度.
该文档具有面板,其内容可能比窗口/内容的高度长.当发生这种情况时,文档的高度会发生变化.但是我需要在没有滚动条的情况下保持文档的高度.该面板应该取代滚动条.
示例:http://jsfiddle.net/moizhb/GSSD3/
面板是如何实例化的:
<div data-role="panel" id="navpanel" data-theme="a" data-display="overlay"></div>
Run Code Online (Sandbox Code Playgroud)
我很欣赏这里的任何指示.
谢谢!
我有一个小任务查看器,你可以创建一个任务面板,无论如何,我遇到的问题是,当你在移动设备上并向下滚动面板时,它会回到顶部,所以你需要再次向下滚动以便能够点击你想要的输入,当你完成输入(或不输入)并尝试点击后退按钮以关闭键盘它再次回到顶部.
我试图使用,.focus
但它忽略了它.
为什么会这样?我该如何解决?任何帮助都是真诚的感谢.
单击加号按钮以打开面板
PS:我清理了代码以专注于这个问题
我的代码:
#header {
background-color: #72a9dc;
text-shadow: 0 0 3px #000;
color: white;
}
.code {
background-color: #b4d0ec;
text-shadow: 0 0 1px #fff;
border-radius: 3px;
width: 30px;
text-align: center;
float: left;
}
.label {
margin-left: 10px;
text-align: center;
float: left;
}
.date {
float: right;
border-radius: 3px;
border: 1px solid #000;
width: 100px;
height: 20px;
text-align: center;
text-shadow: 0 0 0 #fff;
color: black;
}
.detail {
font-size: 20px;
color: #72a9dc;
}
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html> …
Run Code Online (Sandbox Code Playgroud)我正在尝试使用 jQuery Mobile 1.3.2 实现面板功能。这是我的代码:
<div data-role="page" id="homePage">
<section data-role="panel" class="row">
PANEL HERE..
</section>
<section data-role="header" class="row">
<div class="large-12 columns">
<h3>
Header..
</h3>
</div>
</section>
<section data-role="content" class="row">
<div class="large-12 columns">
CONTENT..
</div>
</section>
<section data-role="footer" class="row">
<div class="large-12 columns">
FOOTER..
</div>
</section>
<script type="text/javascript">
$(function ()
{
}());
</script>
</div>
Run Code Online (Sandbox Code Playgroud)
当我运行这是浏览器时,出现错误:
$.data(...) 未定义
我已经将它追溯到 jquery.mobile-1.3.2.js 的第 10330 行:
var $theme = $.data( page[0], "mobilePage" ).options.theme,
Run Code Online (Sandbox Code Playgroud)
我错过了什么?
我正在使用jQuery mobile创建一个移动网站(1.3).
在这个网站中我使用了一个面板作为我的菜单,它由屏幕左上角的"条形"按钮激活,或者从左向右滑动(在桌面上;单击并向右移动鼠标).
这一切都正常,直到我导航到另一个页面.使用jQuery移动AJAX函数加载新页面,在console.log中我的面板div被记录,所以我知道它在那里但是.panel('open')函数没有被触发.
我尝试以不同的方式制作我的链接,但没有运气:
<a href="?controller=website&action=algemeenInvoer">Algemene invoer</a>
<a href="#" onclick="$.mobile.changePage('?controller=website&action=algemeenInvoer', { transition:'slideup'} );">Algemene invoer, using mobile.changePage</a>
Run Code Online (Sandbox Code Playgroud)
由于我使用php,我无法创建一个简单的JSFiddle来演示问题,但这里是我的开发页面的链接:snip
我希望有人可以帮我解决这个问题,并在页面导航后触发我的.panel('open').
编辑: 当前滑动功能:
$(document).on('pageinit',function(){
$('div[data-role="content"]').on("swiperight",function(){
console.log($('#menu'));
//open panel after swiped x px.
$.event.special.swipe.horizontalDistanceThreshold = 80;
$('#menu').panel("open");
});
});
Run Code Online (Sandbox Code Playgroud) 当任何侧栏打开时,我不希望用户滚动.它们应该在关闭时滚动.
我使用下面的代码,但它不适用于Android移动设备
$(document).bind('panelopen', function (e, data) {
$('body').css("overflow", "hidden");
});
$(document).bind('panelclose', function (e, data) {
$('body').css("overflow", "auto");
});
Run Code Online (Sandbox Code Playgroud)