gpt4 book ai didi

html - Tizen Wearable 应用程序按钮不可点击

转载 作者:行者123 更新时间:2023-11-28 03:02:19 25 4
gpt4 key购买 nike

我在一个漫画游戏中创建了两个像按钮一样的 href。我正在关注这个 tutorial .我遇到的问题是链接不可点击。他们不响应触摸,点击时没有任何反应。

这是元素结构:

enter image description here

这是我的 styles.css:

  * {
font-family: Verdana, Lucida Sans, Arial, Helvetica, sans-serif;
}

body {
margin: 0px auto;
background-color:#0a3003;
}

img {
margin:0px;
padding:0px;
border:0px;
width:100%;
height:auto;
display:block;
float:left;

}

.btn {
display: inline-block;
padding: 15px 4% 15px 4%;
margin-left: 1%;
margin-right: 1%;
margin-top: 5px;
margin-bottom: 5px;
font-size: 30px;
text-align: center;
vertical-align: middle;
border: 0;
color: #ffffff;
background-color: #4b4237;
width: 40%;
height: 80px;
text-decoration: none;
}

现在我将向您展示无法点击按钮的 index.html:

    <!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,user-scalable=no">
<title>2nd Race</title>
<link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css">
<link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
<!-- load theme file for your application -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div>
<div>
<img src="images/coverpage.png" alt="Cover Page"/>
</div>
<div>
<a href="#" class="btn" >&lt;&lt;</a>
<a href="comic/page1.html" class="btn" >&gt;&gt;</a>
</div>

</div>
<script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
<script type="text/javascript" src="js/circle-helper.js"></script>
<script src="app.js"></script>
<script src="lowBatteryCheck.js"></script>
</body>
</html>

当我将程序加载到 tizen 可穿戴模拟器上时,它看起来像这样,但没有任何内容可点击:

enter image description here

最佳答案

在我看来,如果你想在带有 tau.js 库的页面之间移动,你需要遵循他们的规则。这里有一些引用指南。
https://developer.tizen.org/development/ui-practices/web-application/tau/hello-world#fill_content

可能出现这个问题是因为你没有定义TAU的“page”。
这很简单。只需在根

标签中插入 class="ui-page"。
我在桌面上使用 Tizen IDE 进行了测试。在你的 index.html 中,

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,user-scalable=no">
<title>2nd Race</title>
<link rel="stylesheet" href="lib/tau/wearable/theme/default/tau.min.css">
<link rel="stylesheet" media="all and (-tizen-geometric-shape: circle)" href="lib/tau/wearable/theme/default/tau.circle.min.css">
<!-- load theme file for your application -->
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="ui-page">
<div class="ui-content">
<img src="images/coverpage.png" alt="Cover Page"/>
<div>
<a href="#" class="btn">&lt;&lt;</a>
<a href="comic/page1.html" class="btn">&gt;&gt;</a>
</div>
</div>
</div>
<script type="text/javascript" src="lib/tau/wearable/js/tau.min.js"></script>
<script type="text/javascript" src="js/circle-helper.js"></script>
<script src="app.js"></script>
<script src="lowBatteryCheck.js"></script>
</body>
</html>

在所有其他页面上(comic/page1.html、page2.html...等)

<!DOCTYPE html>
<html>
<body>
<div class="ui-page">
<div class="ui-content">
<img src="../images/page1.png" alt="Page 1" />
<div>
<a href="../index.html" class="btn" >&lt;&lt;</a>
<a href="page2.html" class="btn" >&gt;&gt;</a>
</div>
</div>
</div>
<script type="text/javascript" src="../../lib/tau/wearable/js/tau.min.js"></script>
</body>
</html>

请用上面的例子再试一次。
我检查元素现在运行良好:)

关于html - Tizen Wearable 应用程序按钮不可点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34269132/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com