jquery 翻转开关无法使用 jquery-toggles 工作

标签 jquery css toggle

我创建了一个使用 Simon Tabor 的“jquery-toggles”插件 ( https://github.com/simontabor/jquery-toggles ) 的简单示例。尽管它有效,但图形永远不会显示。我确认 CSS 和 JS 加载正常,但仍然没有图像。有人能找出原因吗?

<html>
  <head>
    <link rel="stylesheet" href="/include/jquery-toggles-master/themes/toggles-light.css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="/include/jquery-toggles-master/toggles.min.js"></script>
    <script>
      $(document).ready(function () {
        $('.toggle').toggles();
        });
    </script>
  </head>
  <body>
    <div class="toggle toggle-select" data-type="select"></div>
  </body>
</html>

最佳答案

您需要用正确的主题包装您的切换。

<div class="toggle-light">
  <div class="toggle toggle-select" data-type="select"></div>
</div>

示例:http://jsbin.com/okupof/2/edit

如果查看 http://simontabor.com/labs/toggles/ 的来源那么您将在 <div class="themes"> 中看到更多示例

关于jquery 翻转开关无法使用 jquery-toggles 工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15423559/

相关文章:

html - Heroku Nodejs 服务器 img 文件不断出现 404

html - 网站在本地主机上运行,​​上传时不显示图像

Javascript:切换功能不起作用

javascript - 专注于隐藏元素(取消隐藏后)并使用切换时的 jQuery 问题

jquery - 使用PhoneGap和jQuery的跨域请求不起作用

javascript - 我如何在 $.get(url) 的项目上使用 jquery

javascript - Jquery 鼠标悬停淡入/淡出(最佳实践)

jquery - 使用 jquery 创建动态图

css - 不应用 CSS 的移动方向更改

javascript - 如何使用 JavaScript 显示/隐藏隐藏的 HTML 表格行(无 jQuery)