jQuery Mobile的背景图片不显示在全屏幕iPad的Web应用程序(jQuery Mobil

2019-07-29 13:29发布

像这样我已经设置的数据角色背景=“页面”元素

<div data-role="page" style="background: transparent url('img/background.jpg') no-repeat;" >

它的工作原理完全正常的桌面浏览器和iPad上的Safari浏览器。

我遇到的问题是,当你的网站添加到主屏幕作为一个“应用”,这是一个全屏的Web应用程序。 它不显示背景...

我试图通过一个样式表和内联设置,并左右逢源给我同样的问题。

我完全没了主意,为什么这是行不通的。

任何想法是极大的赞赏。

Answer 1:

到底这是对我工作。

<div data-role="page" id="home" style="background: #000000 
    url('img/background.jpg') repeat;">

不会通过一个CSS文件的工作。



Answer 2:

应用此的元素:

.#target-element {
    background : transparent url(YOUR_URL) 0 0 no-repeat fixed !important;
    background-size : cover;
}​


Answer 3:

这种尝试

<style type="text/css">
.ui-page 
{

    background-image: url("img1.jpg");
    background-attachment:fixed;
    background-repeat: no-repeat;
    background-size: 100%;
}
</style>


Answer 4:

在你的CSS文件:

[data-role=page] {
    background: transparent url('img/background.jpg') no-repeat;
}


Answer 5:

创建CSS类,并结束与每个属性!important过分规则框架的CSS。 这就是为什么它是工作仅内嵌



文章来源: jQuery Mobile background image not showing on a full screen iPad web app