Может кто-нибудь показать простой пример использования BeautyTips? - PullRequest
Новая
       24

Может кто-нибудь показать простой пример использования BeautyTips?

0 голосов
/ 28 июля 2010

Ищете простой пример использования подсказок по красоте (включая HTML + CSS)? Мое требование таково - я отображаю названия продуктов. При наведении курсора на название продукта я хочу отобразить изображение продукта во всплывающей подсказке. Как мне это сделать?

спасибо

Ответы [ 2 ]

1 голос
/ 28 июля 2010

Вот сайт с некоторыми примерами: http://www.lullabot.com/files/bt/bt-latest/DEMO/index.html

Предполагается, что вы имеете в виду этот плагин jquery.

0 голосов
/ 09 ноября 2011

Вот оно.Вам просто нужно убедиться, что файлы js загружаются.Обратите внимание, что я использую hoverintent lib здесь, чтобы дать задержку, прежде чем что-нибудь всплывет. 

<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="jquery.bt.min.js"></script>
<script type="text/javascript" src="jquery.hoverIntent.minified.r6.js">
<div id="mydiv">Mouse over here to see it poppin'</div>
<script>
$("mydiv").bt("Text to pop out",{
            showTip: function(box){
                $(box).fadeIn(300);
            },
            hideTip: function(box, callback){
                $(box).animate({opacity: 0}, 100, callback);
            },
            hoverIntentOpts: {
                interval: 1000,
                timeout: 200
            },
            fill: '#E1EEF8',
            cornerRadius: 10,
            strokeWidth: 0,
            shadow: true,
            shadowOffsetX: 3,
            shadowOffsetY: 3,
            shadowBlur: 8,
            shadowColor: 'rgba(0,0,0,.9)',
            shadowOverlap: false,
            noShadowOpts: {strokeStyle: '#999', strokeWidth: 2},
            positions: ['top', 'bottom','right']
        });
</script>
...