Question

我正在使用jQuery UI将一些小部件放在主要为大屏幕设计的网页上。我正在寻找一个flipswitch小部件，我发现了一个由jQuery移动框架提供的小部件。

是否可以使用jQuery mobile来使这个flipswitch小部件工作，而不需要整个jQuery移动主题？

Answer 1

您可以通过创建custom build来使用jQuery Mobile的小部件。您所要做的就是选择所需的小部件，然后加载JS库以及样式表。您还需要修改样式表，方法是手动修改或使用ThemeRoller。

HTML

<head>
  <link rel="stylesheet" href="structure.css" />
  <link rel="stylesheet" href="theme.css" />
  <script src="jquery-1.11.1.min.js"></script>
  <script src="custom-build.js"></script>
</head>
<body>
  <form>
    <label for="flip-checkbox-1">Flip toggle switch checkbox:</label>
    <input type="checkbox" data-role="flipswitch" name="flip-checkbox-1" id="flip-checkbox-1">
  </form>
</body>

要初始化窗口小部件，只需在.flipswitch()上调用.ready()即可。有关更多方法，请检查小部件的API。

$(function () {
  $("#flip-checkbox-1").flipswitch();
});

<强> Demo

是否可以在非移动网页中使用单个jQuery移动小部件？

1 个答案: