gpt4 book ai didi

使用面板和页面转换的 Jquery Mobile 故障

转载 作者:行者123 更新时间:2023-12-01 04:54:56 25 4
gpt4 key购买 nike

我已经使用 Jquery Mobile 实现了面板导航系统。然而,当发生页面转换时,似乎存在一些图形故障。在我的桌面 Chrome 上,页面上的渐变在过渡过程中看起来被压扁了。在我的移动 Chrome 浏览器上访问同一页面时,在转换过程中页面底部会出现一条白线。

通过我的测试,我发现如果我去掉面板导航,图形故障也会消失。

这是其中一个页面的示例。其他页面在结构上看起来相同。

<!DOCTYPE html> 
<html>
<head>
<title>Vidapp</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></sc ript>

<link rel="stylesheet" href="resources/custom.css" />
</head>

<body>
<div data-role="page" data-theme="a">

<div data-id="header" data-role="header" data-position="fixed" data-tap-toggle="false">
<a href="#sidemenu" data-icon="bars">Menu</a>
<h1>Contributions</h1>
<a href="#" data-icon="home">Gift</a>
</div>

<div id="sidemenu" data-role="panel" data-position-fixed="true" data-display="overlay" data-theme="a">
<ul data-role="listview">
<li><a href="/views/browse/trending.html">Trending</a></li>
<li><a href="/views/browse/friends.html">Friends</a></li>
<li><a href="/views/browse/contributions.html">Contributions</a></li>
<li><a href="/views/browse/mygifts.html">My Gifts</a></li>
</ul>
</div>

<div data-role="content">
<input type="search" name="search" id="search" data-mini="true" placeholder="Have a Reference Code?" />
<h2>My Contributions</h2>
</div>

</div>
</body>
</html>

代码托管在这里:Demo of Error

我无法弄清楚是什么导致这些图形故障发生!

最佳答案

根据 jQuery Mobile 网站:http://jquerymobile.com/demos/1.3.0-rc.1/docs/demos/widgets/panels/

A panel must be a sibling to the header, content and footer elements inside a jQuery Mobile page. You can add the panel markup either before or after these elements, but not in between. A panel cannot be placed outside a page, but this constraint will be removed in a future version.

尝试将面板移至标题之前或联系人 div 之后。

关于使用面板和页面转换的 Jquery Mobile 故障,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15033569/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com