动态更改jQueryMobile html5应用程序中的背景图片
问题描述:
我有一个带有不同HTML页面的jQueryMobile应用程序。只有第一页包含对CSS文件的引用,因为任何其他页面都不会在jQueryMobile中加载标题。动态更改jQueryMobile html5应用程序中的背景图片
在我一般的style.css文件,我设置背景图片那样:
.ui-page {
background: transparent url(../img/iOS/backgroundBanner.jpg);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
.ui-page { background-image: url(../img/iOS/backgroundBanner-2x.jpg);
-webkit-background-size: 320px 480px;
}
这一工程,但...我们如何在一个特定的页面更改背景图片?
谢谢!
答
您可以在每个页面上使用不同的id或class来创建容器div,并更改特定div的背景.onClick()。
实施例:
<style>
.home {
background: transparent url(../img/iOS/home_background.jpg);
}
.about{
background: transparent url(../img/iOS/about_background.jpg);
}
</style>
<div class="home">Home Page</div>
<div class="about">About Us</div>