开发者

Tooltip not working with my css

开发者 https://www.devze.com 2023-04-09 08:18 出处:网络
Why doesn\'t my tooltip work with my css in here? http://jsfiddle.net/BG4Sn/ Please see the jsfiddle, the problem is, that with my css included, the tooltip won\'t show up true box tooltip after mous

Why doesn't my tooltip work with my css in here? http://jsfiddle.net/BG4Sn/

Please see the jsfiddle, the problem is, that with my css included, the tooltip won't show up true box tooltip after mouse enter on links tooltip1 & tooltip2 & tooltip3 . When I remove the link to my css in the html head, it works true.

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(fu开发者_如何学Pythonnction (e) {

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

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


The CSS being applied to .tooltip in your style_s.css is different from your JSFiddle. Copy and paste this .tooltip style into 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;
}

Then linking to style_s.css will produce the same style.

0

精彩评论

暂无评论...
验证码 换一张
取 消