0
onDeviceReady에서 네트워크 연결이 navigator.connection.type과 일치하는지 감지하려고하고 있는데, 그렇지 않은 경우 오프라인 콘텐츠가있는 div가 표시되지만 작동하지 않습니다. . 장치에서 실행 (Z10).Phonegap - 오프라인 모드에서 CSS가 작동하지 않습니다.
내 페이지
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone-no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi">
<title>Our Application</title>
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.min.css">
<link rel="stylesheet" href="css/index.css">
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.3.2.min.js"></script>
<script src="js/mustache.js"></script>
<script src="phonegap.js"></script>
</head>
<body onload="init()">
<div data-role="page" id="main">
<div data-role="header" class="logo">
<img src="img/logo.png" />
</div>
<div data-role="content">
<ul id="canlist" data-role="listview">
</ul>
<a href="#newcan" data-role="button" data-icon="plus">New can</a>
</div>
<div data-role="footer" data-theme="c">
<h2 class="offline">Offline Mode</h2>
</div>
</div>
<div data-role="page" id="newcan">
<div data-role="header" class="logo">
<img src="img/logo.png" />
</div>
<div id="candetailcontent" data-role="content">
</div>
<div data-role="footer" data-theme="c">
<p>Snapcan!</p>
</div>
</div>
</div>
<script type="text/javascript" charset="utf-8">
function init() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
alert('ready');
var networkstate = navigator.connection.type;
if(networkstate == "none")
{
$(".offline").css("visibility","visible");
}
}
</script>
</body>
</html>
내 index.css :.?이 후 더 연결 빨간색 '오프라인 모드'볼 수 있어야이 없지만 그렇지 않은 어떤 아이디어가 있다면
.offline{
visibility: hidden;
color: #f00;
font-style:italic;
}