如何删除 Jquery Mobile 对话框的页面背景?
对话框本身仅占据页面的 10% 左右,我想删除对话框的页面背景或将其变为透明,以便上一页仍然可见。
这是调用对话框的 js:
$.mobile.changePage('#popdiv',{transition:'slide', role:'dialog'});
这是
<div data-role="page" id="popdiv" data-role="page" data-theme="e">
<div data-role="content">
<h1>Congrats!</h1>
</div>
</div>
我尝试使用自定义 css 的 div,但它似乎没有改变任何内容
div#popdiv {
background: none; // i also used background-image and color and set it to none
}
,这就是我声明 css 和 js 的方式
<custom css>
<jquery mobile css>
<jquery min.js>
<phonegap.js>
<custom.js>
<jquerymobile.js>
请帮忙。非常感谢。
The dialog itself only occupies about 10% of the page and I wanted to remove or turn the dialog's page background into transparent so that the previous page will still be visible.
This is the js that calls the dialog:
$.mobile.changePage('#popdiv',{transition:'slide', role:'dialog'});
and this is the div
<div data-role="page" id="popdiv" data-role="page" data-theme="e">
<div data-role="content">
<h1>Congrats!</h1>
</div>
</div>
I tried using custom css but it doesn't seem to change anything
div#popdiv {
background: none; // i also used background-image and color and set it to none
}
and this is how i declared the css and js
<custom css>
<jquery mobile css>
<jquery min.js>
<phonegap.js>
<custom.js>
<jquerymobile.js>
Please help. many thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
接受的答案建议为 jQuery Mobile 使用第三方对话框。如果您想使用现有的内置对话框,则以下内容将起作用:
我的 CSS 顺序如下所示:
我的自定义 CSS(帖子主题和 JQM 移动结构 CSS):
页面加载时的 JavaScript:
源:汤姆·克拉克森
The accepted answer suggests using a third party dialog for jQuery Mobile. If you want to use the existing inbuilt dialog, then the following will work:
My CSS order looks like this:
My custom CSS (post theme and JQM mobile structure CSS):
And JavaScript when page loads:
Source: Tom Clarkson
对于 jQuery >1.9,live() 被删除。因此,您必须将 Junto 上面发布的 JavaScript 修改为以下内容:
For jQuery >1.9, live() is removed. Thus you habe to modify the JavaScript that Junto has posted above to following:
我发现了这个:
https://github.com/jtsage/jquery-mobile-simpledialog
这是一个 jquery 移动插件,这正是我想要的。 :)
I have found this:
https://github.com/jtsage/jquery-mobile-simpledialog
This is a jquery mobile plugin and it's what I exactly want. :)
css 中即可。
只需将其添加到对我有用的
Just add this to your css
That works for me.