Custom (Range)Slider Tooltip (https://answers.sap.com/answers/747505/view.html)

<!DOCTYPE HTML>
<html style="height: 100%;">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Demo</title>
    <script id="sap-ui-bootstrap"
      src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
      data-sap-ui-libs="sap.ui.core,sap.m"
      data-sap-ui-theme="sap_fiori_3"
      data-sap-ui-async="true"
      data-sap-ui-modules="demo/custom/MySliderTooltipRenderer,demo/custom/MySliderTooltip"
      data-sap-ui-oninit="module:demo/index"
      data-sap-ui-compatversion="edge"
      data-sap-ui-resourceroots='{"demo": "./"}'
      data-sap-ui-xx-waitfortheme="init"
    ></script>
  </head>
  <body id="content" class="sapUiBody">
  </body>
</html>

sap.ui.define([
  "sap/m/SliderTooltipBase",
  "./MySliderTooltipRenderer",
  "sap/ui/dom/includeStylesheet",
], function(SliderTooltipBase, MySliderTooltipRenderer, includeStylesheet) {
  "use strict";

  includeStylesheet({ // lazy load style
    id: "mySliderTooltipStyle",
    url: sap.ui.require.toUrl("demo/custom/MySliderTooltip.css"),
  });

  return SliderTooltipBase.extend("demo.custom.MySliderTooltip", {
    metadata: {
      properties: {
        dayValue: {
          type: "int",
          defaultValue: 0,
        },
      }
    },

    renderer: MySliderTooltipRenderer,

    sliderValueChanged: function(iValue) {
      return this.setDayValue(iValue);
    },

  });
});

.demoMySliderTooltip {
  height: auto;
  padding: 0.25rem 0.5rem;
  min-width: 3.5rem;
  text-align: center;
}

sap.ui.define([
  "sap/m/SliderTooltipBaseRenderer",
], function(SliderTooltipBaseRenderer) {
  "use strict";

  return Object.assign(SliderTooltipBaseRenderer, {
    renderTooltipContent: (oRm, oControl) =>
      oRm.openStart("div", oControl.getId() + "-inner")
        .class("demoMySliderTooltip")
        .class("sapMSliderTooltipInput")
        .class(SliderTooltipBaseRenderer.CSS_CLASS)
        .openEnd()
        .text("Day " + oControl.getDayValue())
        .close("div"),
  });
});

sap.ui.require([
  "sap/ui/core/mvc/XMLView",
], XMLView => XMLView.create({
  definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc"
    xmlns:custom="demo.custom"
    xmlns="sap.m"
    height="100%">
    <App autoFocus="false">
      <Page title="Custom Slider Tooltip" class="sapUiResponsivePadding--header sapUiResponsivePadding--subHeader sapUiResponsivePadding--content sapUiResponsivePadding--footer sapUiResponsivePadding--floatingFooter">
        <Slider class="sapUiSmallMarginTop" showAdvancedTooltip="true">
          <customTooltips>
            <custom:MySliderTooltip />
          </customTooltips>
        </Slider>
      </Page>
    </App>
  </mvc:View>`,
}).then(view => view.placeAt("content")))