Added ability to change tooltip animate opacity.

[june07]

Proposed changes

Currently using this library for NiM and would like to keep transparent tooltips as seen here:

This small change adds the ability to change tooltip default opacity using options. The ultimate result are tooltips that can be transparent.

M.Tooltip.init(tooltipElement, {
     _animateInOpacity: 0.7
})

Types of changes

• Bug fix (non-breaking change which fixes an issue).
• New feature (non-breaking change which adds functionality).
• Breaking change (fix or feature that would cause existing functionality to change).

Checklist:

• I have read the CONTRIBUTING document.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have added tests to cover my changes.
• All new and existing tests passed.

[june07]

FYI, that update to the _footer.html file was due to the fact that I initially forked Dogfalo/materialize first... that's where the change came from. To eliminate the file from this PR I just removed the change.

[Smankusors]

hmm IMO, I don't see why there's any use case to change the animate opacity? It's kinda hard to read if the opacity below 0.5...

also why the added option begin with underscore?

[june07]

And the opacity above 0.5? As you can see in the gif, opacity is set at 0.7. Without this change the tooltip simply gets stuck as overriding the opacity in css breaks the element hiding.

The underscore was based on the function name the setting is found in tooltip.js.

_animateIn() {
      this._positionTooltip();
      this.tooltipEl.style.visibility = 'visible';
      anim.remove(this.tooltipEl);
      anim({
        targets: this.tooltipEl,
        opacity: 1,
        translateX: this.xMovement,
        translateY: this.yMovement,
        duration: this.options.inDuration,
        easing: 'easeOutCubic'
      });
    }

[Smankusors]

And the opacity above 0.5? As you can see in the gif, opacity is set at 0.7. Without this change the tooltip simply gets stuck as overriding the opacity in css breaks the element hiding.

even though 0.7, for me it's hard to read 😵

The underscore was based on the function name the setting is found in tooltip.js.

I mean... you can see duration: this.options.inDuration, it's not begin with underline. Also the documentation should be updated so the other users know about this option 😉

[DanielRuf]

I think we can remove the underscore.

More options are always a good idea.
But keep in mind that by default materialize strictly follows Material Design spec by Google.

[DanielRuf]

Also the documentation should be updated so the other users know about this option 😉

Definitely.

[june07]

Renamed the option per feedback. Also updated doc.

[Pierstoval]

Shouldn't this be handled by custom CSS rules instead of a feature right in Materialize? 🤔

[DanielRuf]

And the opacity above 0.5? As you can see in the gif, opacity is set at 0.7. Without this change the tooltip simply gets stuck as overriding the opacity in css breaks the element hiding.