Tooltip sizing post 4.4.4.4

Forums Dynamic Forms for SharePoint Tooltip sizing post 4.4.4.4

This topic contains 4 replies, has 2 voices, and was last updated by  Alexander Bautz 1 week, 2 days ago.

  • Author
    Posts
  • #26530

    BenR
    Participant

    Alexander,

    The latest revision (v4.4.4.4) alters the handling of Tooltips…

    I’ve found that the sizing of the floating Tooltip box is a problem, as illustrated in the image below. In comparison to v4.4.3.65, the boxes are smaller horizontally, causing a scroll-bar at bottom that is very small and difficult to manipulate.

    In my configuration, I had changed the color of the dialog header (on-click) and boarder as follows (on-hover):

    
    
    /* Header of tooltip call-out */
    div.tooltipHolderHead {
        background-color: #5fa364;
    }
    
    /* Border color of tooltip call-out */
    span.tooltipContents {
        border: 1px #5fa364 solid;
    }

    My current state is that I have rolled back to v4.4.3.65.

    Thank you for your support and efforts!

    R’grds – Ben.
    Reference:
    Attempting:
    Version information
    DFFS frontend: 4.4.4.4 – August 07, 2019
    DFFS frontend CSS: 4.49 / 4.49
    Autocomplete: 1.6.36 – July 31, 2019
    Cascading dropdowns: 3.7.30 – July 21, 2019
    jQuery: 1.12.4
    Lookup: 1.1.17 – July 21, 2019
    Resource management: not loaded
    SPJS-Utility: 1.336 – July 21, 2019
    vLookup: 2.2.135 – July 31, 2019

    Rollback:
    Version information
    Custom DFFS-folder: DFFS_v4.4.3.65_2019-03-31
    DFFS frontend: 4.4.3.65 – March 31, 2019
    DFFS frontend CSS: 4.46 / 4.46
    Autocomplete: 1.6.28 – January 12, 2019
    Cascading dropdowns: 3.7.26 – March 31, 2019
    jQuery: 1.12.4
    Lookup: 1.1.16 – March 05, 2019
    Resource management: not loaded
    SPJS-Utility: 1.332 – March 05, 2019
    vLookup: 2.2.129 – March 07, 2019

  • #26542

    Alexander Bautz
    Keymaster

    Sorry about that – I obviously didn’t test all sizes of tooltips. Can you try this snippet in your Custom JS to see if it calculates better?

    Please note that you must use the new v4.4.4.4 to test it – I don’ think it will work in the old version.

    spjs.dffs.showTooltip = function (elm) {
        var id = jQspjs(elm).attr('fin'), val, inner = jQspjs("#tooltipHolderInner");
        jQspjs(inner).css({ "width": "auto" }).html("");
        if (spjs.dffs.fields[id] !== undefined) {
            jQspjs("#tooltipOuterWrap").prependTo(jQspjs(elm).parent());
            val = spjs.dffs.buildValStr(spjs.dffs.data.tooltipObj[id]);
            val = spjs.dffs.translateStringWithJSON(val);
            jQspjs("#tooltipOuterWrap").show();
            jQspjs(inner).html(val);
            jQspjs("#tooltipPlaceholder").css({ "display": "inline", "position": "absolute", "top": 20, "left": 20 }).stop(true, true).fadeIn(200, function () {
                var h, w, tot, nw;
                h = jQuery(inner).height();
                w = jQuery(inner).width();
                // Calculate aspect ratio
                tot = h + w;
                if (tot < 200) {
                    nw = tot + 10;
                } else {
                    nw = (tot / 5 * 3) + 10;
                }
                jQuery(inner).css({ "width": nw + "px" });
            });
        }
    };

    Alexander

  • #26599

    Alexander Bautz
    Keymaster

    I have addressed this issue in v4.4.4.5 – please check it out: https://spjsblog.com/2019/08/12/dffs-package-updated-to-v4-4-4-5/

    Alexander

  • #26659

    BenR
    Participant

    Alexander,

    This correction in v4.4.4.5 has addressed this issue nicely!

    I found that I did not need to use the width override at all – your default method of width calculation worked quite well for my Tooltips throughout my forms (both short and long, multiline Tooltips).

    As always, your support and efforts are appreciated!

    R’grds – Ben.
    P.S.: I’ve now upgraded to v4.4.4.5 in production!

  • #26665

    Alexander Bautz
    Keymaster

    Thanks for the feedback – I’m glad it worked out.

    Alexander

You must be logged in to reply to this topic.