如何使用jquery.f厌恶创建一个浮动头
How to create a floating header using jquery.floathead?
我遇到了一个名为jquery.floatad的插件，它非常适合在用户向下滚动时浮动表头，但由于某种原因，我无法让这个插件工作。
请参阅下面的html和javascript，以及这里的代码笔。
Javascript：
var $table = $('Table1');
$table.floatThead();
HTML
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/floatthead/1.2.10/jquery.floatThead.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/floatthead/1.2.10/jquery.floatThead-slim.min.js"></script>
<table id="Table1">
<thead>
<tr>
<th>Time</th>
<th>Ideas</th>
<th>Likes</th>
<th>Sent to</th>
<th>Project related</th>
<!--
<th>like or dislike</th>
-->
</tr>
</thead>
<tbody>
<tr>
<td>2014-10-31</td>
<td>Content1</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-31</td>
<td>Content3</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-09-31</td>
<td>Content4</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-31</td>
<td>Content1</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-31</td>
<td>Content3</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-09-31</td>
<td>Content4</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-31</td>
<td>Content1</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-31</td>
<td>Content3</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-09-31</td>
<td>Content4</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-21</td>
<td>Content2</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
<tr>
<td>2014-10-01</td>
<td>Content</td>
<td><a href="#" >20</a></td>
<td><a href="#" >ipsum</a></td>
<td> <button type="submit" class="btn btn-default">
<span class="glyphicon glyphicon-tasks"></span></button></td>
</tr>
</tbody>
</table>
您在选择器中错过了哈希符号。应为：
$('#Table1');
至少在钢笔里。
相关文章：
- 我已经创建了一个jquery转盘，并使用if条件来运行和停止转盘
- 按照选项卡索引的顺序循环一个jQuery选择
- 在创建对象后附加一个jquery事件
- 我需要一个jQuery函数来只工作在700px以上的屏幕大小，无法在我的代码中发现错误
- 一个jquery验证器方法，它不接受纯数字或纯特殊字符，但接受上面是否有字母
- 我做了一个jquery幻灯片，但没有;我工作不好，我该怎么办
- 我创建了一个jQuery幻灯片，但它一直在重复相同的图像
- 是preventDefault(）一个jQuery函数或javascript函数
- 使用一个 jquery 代码关闭多个模态
- 如何在 elfinder(一个 jquery 文件管理器插件）中只显示文件夹列表
- 遍历下一个和上一个 jQuery 选项卡
- module.exports一个jQuery插件
- 有没有一个jquery marquee插件/脚本可以处理不同宽度的图像
- 一个jquery初始化中有多个类
- 如何从其中的另一个jquery脚本运行.load(）
- 从 javascript 数组创建一个 Jquery 数组
- 第一个jquery事件正在发生，但没有发生第二个事件
- 向一个jQuery/DOM元素添加一个函数
- 我们如何在jQuery Datatable调用结果中启动另一个jQuery插件，而不是页面就绪函数
- 我可以自动生成一个jquery块，对不同的元素做同样的事情吗
