Phonegap Background image include in phonegap application
<!-- Copyright (c) 2012 Mobile Developer Solutions -->
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
<title>MDS PhoneGap API Demo with jQuery Mobile</title>
<link rel="stylesheet" href="jquery.mobile/jquery.mobile{$jqmversion}.min.css" />
<link rel="stylesheet" href="index.css" />
<script src="jquery.mobile/jquery-1.7.2.min"></script>
<script src="jquery.mobile/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
<script type="text/javascript" charset="utf-8" src="index.js"></script>
<style type="text/css">
.ui-page {
background: url(image/HRMS.png);
background-repeat:no-repeat;
background-position:center center;
background-size:cover;
background-size:100% 100%;
}
</style>
</head>
<body>
<div data-role="page" data-theme="b" id="pagehome">
<div data-role="header">
<h1>Header tex</h1>
</div><!-- /header -->
<div data-role="content" data-theme="d">
some text
</div><!-- /content -->
<div data-role="footer">
<h1>Neki izbornik</h1>
</div>
</div><!-- /page -->
</body>
</html>
=================================
Header image include in phonegap
<div id="wrapperHeader">
<div id="header">
<img src="images/logo.png" alt="logo" />
</div>
</div>
div#wrapperHeader {
width:100%;
height;200px; /* height of the background image? */
background:url(images/header.png) repeat-x 0 0;
text-align:center;
}
div#wrapperHeader div#header {
width:1000px;
height:200px;
margin:0 auto;
}
div#wrapperHeader div#header img {
width:; /* the width of the logo image */
height:; /* the height of the logo image */
margin:0 auto;
}
No comments:
Post a Comment