Tipsy tooltip problem  Hitskin_logo Hitskin.com

This is a Hitskin.com skin preview
Install the skinReturn to the skin page

The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.
3 posters

    Tipsy tooltip problem

    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Tipsy tooltip problem

    Post by udarsha45 August 28th 2015, 8:16 am

    I tried adding the code that I found here; http://www.fmcodes.com/t291-how-to-add-tipsy-tooltip

    But it's not working....

    Does anyone know a code that may work?


    Last edited by udarsha45 on September 12th 2015, 1:41 pm; edited 1 time in total
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 August 30th 2015, 5:27 am

    bump
    Ape
    Ape
    Administrator
    Administrator


    Male Posts : 19432
    Reputation : 2010
    Language : fluent in dork / mumbojumbo & English haha

    Solved Re: Tipsy tooltip problem

    Post by Ape August 30th 2015, 3:06 pm

    I think the best way to get this working is to ask on there forum as this is not a code that we host on FM



    Tipsy tooltip problem  Left1212Tipsy tooltip problem  Center11Tipsy tooltip problem  Right112
    Tipsy tooltip problem  Ape_b110
    Tipsy tooltip problem  Ape1010
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 11:12 am

    That site is sadly dead. :/
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 11:49 am

    What's the URL of the forum you tried installing it on + is it still installed on that forum ?

    Let me know Smile
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 11:51 am

    Ange Tuteur wrote:What's the URL of the forum you tried installing it on + is it still installed on that forum ?

    Let me know Smile

    I tried installing the code in my site; http://www.bleachstory.net/

    No, I removed the code since it was not working.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 12:01 pm

    Try reinstalling everything, if there are any problems let me know and I'll check to see what's preventing it from functioning.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 12:08 pm

    Ange Tuteur wrote:Try reinstalling everything, if there are any problems let me know and I'll check to see what's preventing it from functioning.

    Reinstalled it but it's still not working.

    When I hover around a topic title, it shows nothing.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 12:35 pm

    I see. Try the following instead, it should be a lot easier. Go to Modules > JavaScripts codes management > Create a new script

    Placement : In all the pages
    Code:
    (function() {
      document.write('<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tipsy/1.0.2/jquery.tipsy.css" rel="stylesheet" type="text/css" />');

      $(function() {
        $.getScript('https://cdnjs.cloudflare.com/ajax/libs/jquery.tipsy/1.0.2/jquery.tipsy.min.js', function() {
          $('a').tipsy({gravity: 's'});
        });
      });
    })();

    I added it to all links using south gravity. You can see here for more information :
    http://onehackoranother.com/projects/jquery/tipsy/
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 12:37 pm

    So just to be clear; I should add the above JS code and the CSS found here right?
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 12:40 pm

    No, don't add anything from there. The script I gave you will add the JS and CSS from a CDN.

    To apply the tooltip to elements, just place your code where I have $('a').tipsy({gravity: 's'}); in the getScript callback function.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 12:54 pm

    The code works but when you hover over a topic title the tool-tip appears and begins to shutter like crazy.

    It's hard to explain. I think if you go to my site and see, you would understand what I'm saying.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 1:13 pm

    Looks like the toolbar margin offset is causing that. Try changing the gravity from 's' to 'n' to see if that helps.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 1:21 pm

    Ange Tuteur wrote:Looks like the toolbar margin offset is causing that. Try changing the gravity from 's' to 'n' to see if that helps.

    It works! Very Happy

    But if I may ask; why is the tool-tip appearing way lower from the topic title?
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 1:26 pm

    I was correct it's caused by a 30px margin. Mm.. try adding the following rule to your stylesheet.
    Display > Colors > CSS stylesheet

    Code:
    body {
      margin-top:0 !important;
      padding-top:30px;
    }

    It'll get rid of the 30px margin caused by the toolbar and replace it with a padding instead. Although when you do close the toolbar there'll be a slight gap, but it should fix the position of the tooltips.
    udarsha45
    udarsha45
    Forumember


    Male Posts : 626
    Reputation : 9
    Language : English
    Location : Sri Lanka

    Solved Re: Tipsy tooltip problem

    Post by udarsha45 September 12th 2015, 1:41 pm

    Ange Tuteur wrote:I was correct it's caused by a 30px margin. Mm.. try adding the following rule to your stylesheet.
    Display > Colors > CSS stylesheet

    Code:
    body {
      margin-top:0 !important;
      padding-top:30px;
    }

    It'll get rid of the 30px margin caused by the toolbar and replace it with a padding instead. Although when you do close the toolbar there'll be a slight gap, but it should fix the position of the tooltips.

    Thanks alot mate! Very Happy

    Topic solved.
    Ange Tuteur
    Ange Tuteur
    Forumaster


    Male Posts : 13207
    Reputation : 3000
    Language : English & 日本語
    Location : Pennsylvania

    Solved Re: Tipsy tooltip problem

    Post by Ange Tuteur September 12th 2015, 1:44 pm

    You're welcome. Mr. Green

    Topic archived

    Have a great weekend. Smile