Javascript Bootstrap not working

Hi,

i want a tooltip on a button in the generic javascript view.

The tooltip is always show at the bottom position and the css styles doesn’t work.

Can anyone tell me why?

$(function() {
$(document).ready(function(){
$(’[data-toggle=“tooltip”]’).tooltip();
});
});

/* Tooltip */
.tooltip > .tooltip-inner {
background-color: #73AD21;
color: #FFFFFF;
border: 1px solid green;
padding: 15px;
font-size: 20px;
}

/* Tooltip on bottom */
.tooltip.bottom > .tooltip-arrow {
border-bottom: 5px solid blue;
}

Hey @ptrwlr,

Thanks for your post. Any chance you could share your workflow so I can have a look?

Cheers,
Ben

Hey @blaney

i will post a little example workflow.

Hi @blaney

here is the workflow.js_example.zip (6.8 KB)

Thanks for sharing!

@DanielBog found a solution that works for me as well:

.ui-tooltip {
background-color: #7C89A1;
color: #FFFFFF;
border: 1px solid green;
padding: 15px;
font-size: 40px;
}

Let me know if this change solves your problem! :slight_smile:

Best,
Ben

1 Like

Hi @blaney

can you send me the workflow?
It’s not working in my workflow.

Thx

js_example.knwf (6.2 KB)

Here you go!

Hi @blaney

thx!

Can you also help me here?

Hi @blaney

thanks for your help!
Not all of feature are working.
I’m trying to do it like here.
https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_tooltip_css&stacked=h