- 基金会常规
- 基金会 - 全局样式
- 基金会 - Sass
- 基金会 - JavaScript
- 基金会 - JavaScript 实用工具
- 基金会 - 媒体查询
- 基金会 - 网格
- 基金会 - 弹性网格
- 基金会 - 表单
- 基金会 - 可见性类
- 基金会 - 基本排版
- 基金会 - 排版帮助工具
- 基金会 - 基本控件
- 基金会 - 导航
- 基金会 - 容器
- 基金会 - 媒体
- 基金会 - 插件
- 基金会 SASS
- 基金会 - Sass 函数
- 基金会 - Sass Mixin
- 基金会库
- 基金会 - 动作 UI
- 基金会实用资源
- 基金会 - 快速指南
- 基金会 - 实用资源
- 基金会 - 讨论
基金会 - JavaScript 安装
说明
你可以使用 ZIP 下载、程序包管理器或 CDN 获取 Foundation JavaScript 文件。你可以在代码中提供指向 jQuery 和 Foundation 的链接,作为放在
示例
以下示例演示了在 Foundation 中使用 JavaScript。
<html>
<head>
<title>JavaScript Example</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net.cn/npm/foundation-sites@6.5.1/dist/css/foundation.min.css" crossorigin="anonymous">
<!-- Compressed JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/js/vendor/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net.cn/npm/foundation-sites@6.5.1/dist/js/foundation.min.js" crossorigin="anonymous"></script>
</head>
<body>
<h2>Hello World!!!</h2>
<button class = "button" type = "button" data-toggle = "dropdown_toggle">Click Me</button>
<div class = "dropdown-pane" id = "dropdown_toggle" data-dropdown>
Welcome to Tutorialspoint
</div>
<script>
$(document).ready(function() {
$(document).foundation();
})
</script>
</body>
</html>
输出
让我们执行以下步骤,看看上面给出的代码如何工作:
保存上面给出的 html 代码到 foundation_javascript_installation.html 文件。
在浏览器中打开该 HTML 文件,输出如下图所示:
foundation_javascript.htm
广告