0

我有一个从 ajax 查询中加载一些数据的表。

我试图在上面做一个提示（本地，带箭头）..

这是我的提示选项：

$('.load-local').cluetip({
        sticky: true,
        arrows: true,
        showTitle: false,
        mouseOutClose: true,
        delayedClose: 400,
        local: true,
        hideLocal: true,
        width: 170
    });

我把它放在某个<td>（在“详细信息”部分下）..

因此，当用户将鼠标悬停在其上时<td>，提示将显示在右侧，就像我想要的那样..

我附上了它的预览：

右边

然后，我决定对其进行修改以对用户更有效..

因此，如果用户将鼠标悬停到<tr>，则提示将显示..

但是，当我在 this 上放置线索提示类和 rel 属性时<tr>，线索提示显示在左侧..

我附上了它的预览：

左边

我想要：当用户将鼠标悬停<tr>在线索提示将显示在右侧（就像我在<td>..

我怎样才能做到？

我已经尝试使用 jquery 来触发<td>when mouseover，<tr>但仍然失败..

你有什么想法吗？

非常感谢您..

您可以设置溢出或使用 CCS 媒体查询来动态更改字体大小。

溢出：

 .your-class{overflow:auto;}

这只会在数据大于单元格大小时显示滚动条。

CSS 媒体查询：

.your-class{
    font-size: 18px;
}

@media all and (max-device-width: 720px){
     .your-class {
        font-size: 16px;
    }
}

@media all and (max-device-width: 640px){
     .your-class {
        font-size: 14px;
    }
}

@media all and (max-device-width: 320px){
     .your-class {
        font-size: 10px;
    }
}

以上根据当前查看页面的设备的视图宽度改变字体大小。

4

1 回答 1

0

你搞好了没..

$('.load-local td').cluetip({
        sticky: true,
        arrows: true,
        showTitle: false,
        mouseOutClose: true,
        delayedClose: 400,
        local: true,
        hideLocal: true,
        width: 170
    });

尝试选择 tr 的子 td 元素。

于 2013-12-06T03:23:49.077 回答