与intro.js相关的问题集中在HTML表格格式上

Question

让我们将上面的图像看作典型的HTML表格。 Intro.js有助于根据数据步骤进行聚焦。

我的表是根据foreach循环生成的。

我想知道是否有可能专注于与图像类似的表格列，而不是关注<td>或<tr>

任何帮助都会非常好。

Answer 1

有一项功能请求在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();