Flexslider-在鼠标悬停在点上时显示工具提示

Flexslider-在鼠标悬停在点上时显示工具提示

问题描述:

我在我的页面中使用 http://flexslider.woothemes.com/ Flex滑块插件.

I am using http://flexslider.woothemes.com/ flex slider plugin in my page.

Below is my code for flexslider:

html: 
<div class="flexslider">
    <ul class="slides">
        <li>Image 1</li>
        <li>Image 2</li>
        <li>Image 3</li>
    </ul>
</div>

js: java script code for flex slider and this code is used to initialize the flex slider while page load.

    $(window).load(function() {
            $('.flexslider').flexslider({   
                animation: "slide",
                slideshow: false,
                controlNav: true,
                directionNav: false,
                easing: "swing"
            });
        });

全部,我想要的是当我将鼠标悬停在点上(用于在幻灯片之间导航)时,工具提示应该重新显示,并显示某种信息,例如幻灯片编号".

All, I want is when I mousehover to dots (which used for navigation among slides) a tooltip should reneder and show some kind of message say "Slide number".

按照RRR的建议,我在每个点上都添加了title.

As suggested by RRR, I have added title to each of the dots.

$(".flexslider ol li a").each(function(index){
   $(this).attr("title","slide number "+(index+1));
});

请参阅此小提琴