Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to make tippy() tooltip popup bigger? #11

Closed
rdatasculptor opened this issue Mar 26, 2021 · 3 comments
Closed

How to make tippy() tooltip popup bigger? #11

rdatasculptor opened this issue Mar 26, 2021 · 3 comments

Comments

@rdatasculptor
Copy link

rdatasculptor commented Mar 26, 2021

If I understand correctly there is no way to control the height and width of the tippy() pop up box. Am I right or did I miss something?

Many thanks in advance!

@rdatasculptor rdatasculptor changed the title How to make tipp() tooltip box bigger? How to make tippy() tooltip box bigger? Mar 26, 2021
@rdatasculptor rdatasculptor changed the title How to make tippy() tooltip box bigger? How to make tippy() tooltip popup bigger? Mar 27, 2021
@JohnCoene
Copy link
Owner

Not directly I believe, but since it supports HTML one can use any CSS.

tippy("<strong>Works with html!</strong>", 
  tooltip = "<div style='height:100px;'>I'm the tooltip!</div>",
)

Alternatively you could create a utility function and a class.

tippy_square <- function(text, content, ...){
  content <- sprintf("<div class='tp'>%s</div>", content)
  tippy(text, content, ...)
}

htmltools::browsable(
  htmltools::tagList(
    htmltools::tags$style(
      ".tp{
        height:200px;
        width:200px;
        text-align: center;
      }"
    ),
    tippy_square("Hover me", "Tooltip")
  )
)

@rdatasculptor
Copy link
Author

yesss. Nice, good working solutions! thanks again John :)

@rdatasculptor
Copy link
Author

rdatasculptor commented Mar 27, 2021

I still run into a problem when there is a lot of text. The black background doesn't seem endless. When you add enought lines in the tooltip, you will see it seems actually a circle. Any ideas about how to make the black background bigger?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants