Sujet : info bulles jquery : faire apparaitre en dessous au lieu de dessus

/***********************************************************/
/*                    tinyTips Plugin                      */
/*                      Version: 1.0                       */
/*                      Mike Merritt                       */
/*                 Updated: Feb 4th, 2010                  */
/***********************************************************/

(function($){  
    $.fn.tinyTips = function (supCont) {
        
        /* User settings
        **********************************/
        
        // Enter the markup for your tooltips here. The wrapping div must have a class of tinyTip and 
        // it must have a div with the class "content" somewhere inside of it.
        var tipFrame = '<div class="tinyTip"><div class="content"></div><div class="bottom">&nbsp;</div></div>';
        
        // Speed of the animations in milliseconds - 1000 = 1 second.
        var animSpeed = 300;
        
        /***************************************************************************************************/
        /* End of user settings - Do not edit below this line unless you are trying to edit functionality. */
        /***************************************************************************************************/
        
        // Global tinyTip variable;
        var tinyTip;
        var tText;
        
        // When we hover over the element that we want the tooltip applied to
        $(this).hover(function() {
        
            // Inject the markup for the tooltip into the page and
            // set the tooltip global to the current markup and then hide it.
            $('body').append(tipFrame);
            tinyTip = $('div.tinyTip');
            tinyTip.hide();
            
            // Grab the content for the tooltip from the title attribute (or the supplied content) and
            // inject it into the markup for the current tooltip. NOTE: title attribute is used unless
            // other content is supplied instead.
            if (supCont === 'title') {
                var tipCont = $(this).attr('title');
            } else if (supCont !== 'title') {
                var tipCont = supCont;
            }
            $('.tinyTip .content').html(tipCont);
            tText = $(this).attr('title');
            $(this).attr('title', '');
            
            // Offsets so that the tooltip is centered over the element it is being applied to but
            // raise it up above the element so it isn't covering it.
            var yOffset = tinyTip.height() + 10;
            var xOffset = (((tinyTip.width() - 1) / 2)) - ($(this).width() / 2);
            
            // Grab the coordinates for the element with the tooltip and make a new copy
            // so that we can keep the original un-touched.
            var pos = $(this).offset();
            var nPos = pos;
            
            // Add the offsets to the tooltip position
            nPos.top = pos.top - yOffset;
            nPos.left = pos.left - xOffset;
            
            // Make sure that the tooltip has absolute positioning and a high z-index, 
            // then place it at the correct spot and fade it in.
            tinyTip.css('position', 'absolute').css('z-index', '1000');
            tinyTip.css(nPos).fadeIn(animSpeed);
            
        }, function() {
            
            $(this).attr('title', tText);
        
            // Fade the tooltip out once the mouse moves away and then remove it from the DOM.
            $('div.tinyTip').fadeOut(animSpeed, function() {
                $(this).remove();
            });
            
        });
        
    }

})(jQuery);

Re : info bulles jquery : faire apparaitre en dessous au lieu de dessus

var yOffset = tinyTip.height() + 10;

Re : info bulles jquery : faire apparaitre en dessous au lieu de dessus

oups, je ne suis pas revenue donner de nouvelles sur ce sujet... j'ai finalement abandonné yikes(
merci quand-même !