小编Iva*_*ets的帖子

当页面滚动时，Bootstrap 5 工具提示放置最常见的问题

当强制放置顶部时，我在引导程序中遇到工具提示问题。我现在使用的是最新版本：5.1.3

我尝试创建一个代码片段，但该问题在 codepen 上无法重现，因此我将在此处粘贴代码和视频示例。

function initTooltips() {
  var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
  tooltipTriggerList.forEach(function(tooltipTriggerEl) {
    return new bootstrap.Tooltip(tooltipTriggerEl)
  });
}

initTooltips();

Run Code Online (Sandbox Code Playgroud)

.section {
  padding-top: 500px;
}

Run Code Online (Sandbox Code Playgroud)

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.js"></script>

<div class="section">
  <div class="row">
    <div class="col-12 text-center mt-5 pt-5">
      <button type="button" class="btn btn-secondary" id="test-btn" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip with button">
                Tooltip on top
            </button>
    </div>
  </div>
</div>

Run Code Online (Sandbox Code Playgroud)

当我向下滚动页面查看该按钮并将鼠标悬停在其上时，工具提示会出现在顶部，其间隙等于滚动位置。

我尝试使用“边界”和“容器”等工具提示选项，但它没有多大帮助。

您对如何修复它有什么想法吗？

html javascript css twitter-bootstrap

Iva*_*ets

2022 04-25

3
推荐指数

1
解决办法

1978
查看次数

如何在draft.js中设置默认字体系列和大小

我正在学习draft.js编辑器,但无法找到如何配置默认的font-family和字体大小.

我试过这种方式:

let editorState = EditorState.createEmpty();

let newState = RichUtils.toggleBlockType(
    editorState,
    'aligncenter'
);

newState = RichUtils.toggleInlineStyle(
    newState,
    'FONT_SIZE_36'
);
newState = RichUtils.toggleInlineStyle(
    newState,
    'TIMES_NEW_ROMAN'
);

Run Code Online (Sandbox Code Playgroud)

有什么奇怪的,aligncenter样式工作正常,但是当组件获得焦点时,字体大小和系列会消失.

你能否建议正确的方法怎么做？

html javascript draftjs

Iva*_*ets

2016 03-27

0
推荐指数

1
解决办法

3991
查看次数