我有这个应用全局黑暗主题的 .scss 规则。

我已经决定相反主题的工具提示看起来更好。我喜欢深色主题#app 上的浅色主题工具提示和浅色主题#app 上的深色主题工具提示，而不是深色主题#app 上的深色主题工具提示。

这就是问题所在……我声明的黑暗主题规则正在影响工具提示。我需要以某种方式使里面的每条规则#app.dark-theme都不适用于工具提示。这是工具提示选择器

我已经尝试过如何从公共 CSS 样式中隔离 div？

但它会取消所有样式。我仍然希望将tippy CSS 和Bulma CSS 应用于工具提示。我只是不希望我的深色主题 CSS 影响工具提示。

我也尝试过使用:not()选择器，但它似乎不适合这个用例。

我对使用 Webpack 和 Rails 比较陌生。我正在尝试在 Rails 6 应用程序上安装tippy.js，但无法让视图访问它。（如果我只是在视图的脚本标记中包含tippy.js CDN，我可以让它工作，但我无法通过使用webpack/yarn 让它工作。）

根据tippy.js 的说明，我已经用纱线安装了tippy.js。我的package.json文件：

然后说明说要导入tippy及其CSS，所以我这样做了app/javascript/packs/application.js：

然后，在我index.html.erb看来，我按照他们的创建示例创建了一个示例按钮，并且根据他们没有任何工作的常见问题解答，在正文的末尾调用tippy：

但是，我没有得到工具提示，并且在控制台中，包含tippy('[data-tippy-content]');.

我尝试过的事情：

将 Tippy 放入 config/webpack/environment.js 中的 ProvidePlugin

我必须这样做才能让 jQuery 工作，所以我想我可能必须为tippy.js 做类似的事情：

没有改变任何东西；在我看来仍然有 ReferenceError 。我怀疑我在这里可能做错了什么；我可以找到一堆关于如何为 jQuery 提供插件的示例，但在网上找不到太多其他的示例。

从视图中删除tippy('[data-tippy-content]');并将其放入 app/javascript/packs/application.js

我不再收到 ReferenceError，但工具提示也不起作用。因此，以某种方式，tippy 没有以视图识别的任何方式进行初始化。

在视图中使用他们无所事事的确切 CDN 示例是有效的常见问题解答：

有效——我得到了工具提示并且没有控制台错误——但它破坏了使用 webpack 必须在我的视图中包含 CDN 脚本标签的全部意义。

我应该如何以及在哪里调用，tippy('[data-tippy-content]');以便我的视图正确地包含所有带有 data-tippy-content 属性的标签的tippy.js工具提示？

参考：https ://atomiks.github.io/tippyjs/

尽管interactive:true我指定了#main_container. 我怎样才能得到它“在一切的前面” interactive:true？

另请参见此处：https ://github.com/projectje/bookmark以获取上述代码。我做了一个临时解决方法，在每个第一个字符后面放置一个 BR，这样它就不会流过其他框。但这确实是一个短期的解决方法。

请帮助我，有可能请将如何使用tippy.js或react-popper的完整代码放入react中以创建圆形箭头自定义在此处输入图像描述风格的弹出框：以及如何直接在我们的中使用tippy.js反应应用程序不是反应的Tippy，而是纯粹的tippy

创建弹出框后，我调用了tippy() 构造函数，例如：tippy('.my-tippy-popover', { ... }); 但这又再次创建了所有现有的tippy popovers。因此，如果您有 80 个弹出框并添加了一个新弹出框，则 tippy() 构造函数将创建 81 个新弹出框。如果您单击其中一个弹出窗口，您将获得 2 倍的事件，例如 onShow。如果您现在再次添加一个新的弹出框并运行tippy() 构造函数并在弹出框之后单击，您将获得3x onShow 事件。等等。所以它添加了越来越多的事件监听器。我怎样才能避免这种情况？编辑jsfiddle

我需要同时在页面上显示多个 popper 元素。但问题是当它们中的两个彼此靠近时会出现重叠。有没有办法解决这个问题？

我在下面给出了与 popper 元素相关的代码。

我在传单中使用tippy.js。传单图像的特定坐标中有标记。当点击这些标记时，我想在tippies 中显示一些html 内容。当我想同时显示多个小费时，问题就开始了。谢谢你的帮助。

结果图像如下所示。

我有多个按钮使用创建动态模板的相同tippy 函数。我需要从单击的按钮中获取 data-value="" 并将其传递给tippyjs。

按钮

提示 js

现在我有 $(this) 用于获取按钮。我尝试了多种方法，但没有任何方法可以传递数据 ID

一个典型的 Nextjs 链接在工作时和添加 Tippy 组件看起来很简单，如下图所示，但是这很有效。

如果有人成功完成此操作，我将感谢您的帮助。如果有其他与 NextJs 一起使用的工具提示，我不知道

我尝试使用tippyjs-react做右键菜单：

我知道我需要将带有“contextmenu”的事件侦听器添加到孩子并使用tippyInstance.show() 方法，但是我怎样才能访问该实例？

我想创建一个与屏幕边缘齐平的弹出菜单。似乎 popper 不喜欢这样，因为它总是强制留出 5px 的边距。我尝试将偏移量和填充值设置为 0，但它似乎不起作用。有没有办法做到这一点而不强迫它喜欢

这是我包含的tippy选项和一个JSFiddle：

https://jsfiddle.net/tbgwknpf/1/

如果我向按钮元素添加边距，则tippy 将像我想要的那样与边缘对齐。只有当我要求它与屏幕齐平时，它才会添加 5px 的 translationX