你可以使用 side
和 align
选项控制弹出窗口的位置。side
选项控制弹出窗口显示在元素的哪一侧,align
选项控制弹出窗口与元素的对齐方式。
¥You can control the popover position using the side
and align
options. The side
option controls the side of the element where the popover will be shown and the align
option controls the alignment of the popover with the element.
注意:Popover 足够智能,可以自行调整以适应视口。因此,如果你将
side
设置为left
,将align
设置为start
,但弹出窗口无法适应视口,它将自动调整自身以适应视口。请考虑高亮并将浏览器滚动到下面的元素,以查看实际效果。¥Note: Popover is intelligent enough to adjust itself to fit in the viewport. So, if you set
side
toleft
andalign
tostart
, but the popover doesn’t fit in the viewport, it will automatically adjust itself to fit in the viewport. Consider highlighting and scrolling the browser to the element below to see this in action.
import { driver } from "driver.js";
import "driver.js/dist/driver.css";
const driverObj = driver();
driverObj.highlight({
element: '#left-start',
popover: {
title: 'Animated Tour Example',
description: 'Here is the code example showing animated tour. Let\'s walk you through it.',
side: "left",
align: 'start'
}
});
Use the buttons below to show the popover.