工具提示无法使用我的CSS

时间:2011-09-30 14:11:37

标签: javascript jquery css css3 tooltip

为什么我的工具提示不适用于我的css?的 http://jsfiddle.net/BG4Sn/

请查看jsfiddle,问题是,在我的css包含的情况下,在鼠标进入链接tooltip1&上后,工具提示将不会显示真正的方框工具提示tooltip2& tooltip3。当我在html头中删除我的css链接时,它可以正常工作。

function tool_tip() {
        //var tip = $('.tool_tip').closest('li').find('div').clone();
        $('.tool_tip').mouseenter(function () {
            var $this = $(this),
                $div = $this.closest('li').find('div');
            $(this).attr('title', '');
            $div.fadeTo(300, 0.9);
        }).mousemove(function (e) {

            $('.tooltip').css('bottom', e.pageY + -10);
            $('.tooltip').css('left', e.pageX + 10);

        }).mouseleave(function () {
            $('.tooltip').hide();
        })
    }
tool_tip();

1 个答案:

答案 0 :(得分:0)

在style_s.css中应用于.tooltip的CSS与您的JSFiddle不同。将此.tooltip样式复制并粘贴到style_s.css:

.tooltip {
    background-color: #E5F4FE;
    display: none;
    padding: 5px 10px;
    background-color: #E5F4FE;
    border: #5A5959 1px solid;
    position: fixed;
    z-index: 9999;
    color: #0C0C0C;
    font-size: 0.688em;
}

然后链接到style_s.css将产生相同的样式。