html - 为什么棘轮组件无法正确呈现

Question

这是我的 Fiddle .我从 Segmented Control 添加了 CSS 组件并添加了相关的库，但没有按预期工作，就像在网站中一样:

<div class="segmented-control">
... Control components...
</div>
<div class="card">
... control content
 </div>

Answer 1

您将需要检查 Getting Started页面，然后通读。

这些片段在 jsFiddle 中不起作用，因为它们只响应“触摸”事件(如在移动设备上)而不响应“点击”事件(如在 PC 上)。

来自GitHub - Ratchet文档。

Ratchet is designed to respond to touch events from a mobile device. In order to use mouse click events (for desktop browsing and testing), you have a few options: Enable touch event emulation in Chrome (found in the overrides tab in the web inspector preferences) Use a JavaScript library like fingerblast.js to emulate touch events (ideally only loaded from desktop devices)

此外，由于一些原因，某些样式缺失。

• 组件示例具有框架中没有的额外样式。
• 您的 jsFiddle 缺少一个 <div class="content"> wrapper 。
• > This jsFiddle更近了，但由于上面的触摸事件问题，仍然无法完全工作，但至少它为您指明了正确的方向。