javascript - 与 intro.js 相关的问题重点关注 HTML 表格格式

标签 javascript php intro.js

enter image description here

让我们将上图视为典型的 HTML 表格。 Intro.js 有助于根据数据步骤集中注意力。

my Table是根据foreach循环生成的。

我想知道是否可以专注于与图像类似的表格列,而不是专注于 <td><tr>

任何帮助都会非常好。

最佳答案

有一个开放的功能请求: https://github.com/usablica/intro.js/issues/57所以我可以肯定地说你不能这样做。

您可以做的是创建一个带有 position:absolute 的虚拟透明 div,并通过 javascript 设置位置和大小,然后突出显示它。

在这里查看:https://jsfiddle.net/s848n5hs/2/

$('tr:first-child td').each(function(i) {
    $('.col' + (i + 1) + '_intro')
        .addClass('intro_div')
        .css('top', $(this).offset().top)
        .css('left', $(this).offset().left)
        .css('width', $(this).outerWidth())
        .css('height', $(this).closest('table').height())
})

introJs().start();

关于javascript - 与 intro.js 相关的问题重点关注 HTML 表格格式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37722039/

相关文章:

php - 为什么我的 php 变量没有通过 javascript 警报输出?

php - 将 Woocommerce 排序下拉列表显示为列表

php - 插入多对多关系设置

javascript - 使用 intro.js 突出显示新的 dom 元素

javascript - 如何跟踪在javascript中打开的子窗口

javascript - 为什么 V8 会给出这种令人困惑的错误消息?

javascript - 验证一个 IP 地址实际上是一个带有 Javascript 的网站?

javascript - Webpack - 带有单个 budled js 文件的多页面应用程序

javascript - 无法在 Angular-Material 应用程序上实现 Angular-intro.js

intro.js - 在 intro.js 中使用单击功能进行单步执行