1.1.0 • Published 3 years ago

popper-next v1.1.0

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

popper-next

是一款轻量的 Tooltip 插件

vue、react安装使用 推荐yarn

yarn add popper-next
或者
cnpm install popper-next -S

在html页面中如何使用

<script src="https://unpkg.com/popper-next"></script>
<script>
const btn = document.querySelector('.btn');
const tip = document.querySelector('.tip');
const Popper = createPopper(btn, tip);
</script>

<div class="btn">按钮</div>
<div class="tip">提示信息</div>

在VUE3 + ts中如何使用

<script setup lang="ts">
import { ref } from 'vue'
import createPopper, { PopperConfig } from 'popper-next'

const btn = ref<HTMLElement>();
const tip = ref<HTMLElement>();
const Popper: PopperConfig = createPopper(btn.value as HTMLElement, tip.value as HTMLElement);
</script>

<div ref="btn">按钮</div>
<div ref="tip">提示信息</div>

属性配置

全局配置属性

例如:所有tooltip位置默认初始化右边

import createPopper from 'popper-next'

createPopper.defaults.placement = 'right';

单个配置属性

例如:以下这个tooltip默认没有动画效果

import createPopper from 'popper-next'

const Popper = createPopper(referene, popper, {
  placement: 'top'
});
Popper.defaults.animate = false;

所有属性

属性说明类型可选值默认值必填
placement出现的位置stringtop/bottom/left/rightbottom
trigger触发行为stringhover/click/contextmenuhover
offset出现位置的偏移量number10
animate添加动画booleantrue / falsetrue
speed动画速度,单位毫秒number400
zIndex设置元素的堆叠顺序number2000

所有事件

事件说明类型返回值
show显示tooltipfunctionvoid
hide隐藏tooltipfunctionvoid

umd版本

https://unpkg.com/popper-next

1.0.1-alpha.26

3 years ago

1.0.1-alpha.25

3 years ago

1.0.1-alpha.24

3 years ago

1.0.1-alpha.23

3 years ago

1.0.1-alpha.29

3 years ago

1.0.1-alpha.27

3 years ago

1.0.1-alpha.22

3 years ago

1.0.1-alpha.21

3 years ago

1.0.1-alpha.20

3 years ago

1.0.1-alpha.37

3 years ago

1.0.1-alpha.36

3 years ago

1.0.1-alpha.35

3 years ago

1.0.1-alpha.34

3 years ago

1.0.1-alpha.39

3 years ago

1.0.1-alpha.38

3 years ago

1.0.1-alpha.33

3 years ago

1.0.1-alpha.32

3 years ago

1.0.1-alpha.31

3 years ago

1.0.1-alpha.30

3 years ago

1.0.1-alpha.48

3 years ago

1.1.0

3 years ago

1.0.1-alpha.47

3 years ago

1.0.1-alpha.46

3 years ago

1.0.1-alpha.45

3 years ago

1.0.1-alpha.49

3 years ago

1.0.1-alpha.40

3 years ago

1.0.1-alpha.44

3 years ago

1.0.1-alpha.43

3 years ago

1.0.1-alpha.42

3 years ago

1.0.1-alpha.41

3 years ago

1.0.1-alpha.15

3 years ago

1.0.1-alpha.58

3 years ago

1.0.1-alpha.57

3 years ago

1.0.1-alpha.56

3 years ago

1.0.1-alpha.19

3 years ago

1.0.1-alpha.18

3 years ago

1.0.1-alpha.17

3 years ago

1.0.1-alpha.16

3 years ago

1.0.1-alpha.51

3 years ago

1.0.1-alpha.50

3 years ago

1.0.1-alpha.55

3 years ago

1.0.1-alpha.54

3 years ago

1.0.1-alpha.53

3 years ago

1.0.1-alpha.52

3 years ago

1.0.1-alpha.14

3 years ago

1.0.1-alpha.13

3 years ago

1.0.1-alpha.12

3 years ago

1.0.1-alpha.11

3 years ago

1.0.1-alpha.10

3 years ago

1.0.1-alpha.8

3 years ago

1.0.1-alpha.7

3 years ago

1.0.1-alpha.6

3 years ago

1.0.1-alpha.5

3 years ago

1.0.1-alpha.4

3 years ago

1.0.1-alpha.3

3 years ago

1.0.1-alpha.2

3 years ago

1.0.1-alpha.1

3 years ago

1.0.1-alpha.0

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago

1.0.0-alpha.0

3 years ago