关于工具提示框组件的使用
1.页面引入需要的html代码后,需在js文件添加初始化工具提示的代码
$('[data-toggle="tooltip"]').tooltip();
2.出现该错误 Uncaught TypeError: Bootstrap’s tooltips require Popper.js,如图:
解决方法:需要引入popper.js文件
在cmd(命令提示符)中输入npm install popper.js --save,下载该文件,并在html文件中引入bootstrap.js之前引入popper.js\dist\umd路径下的popper.js
注:popper官网中介绍的npm下载方法,使用npm i @popperjs/core 下载的文件是不一样的,引入该文件@popperjs\core\dist\umd路径下的popper.js会出现以下报错:
TypeError: u is not a constructor
关于页面按设备width相应地显示和隐藏元素的用法
隐藏元素,只需对该元素使用d-none该类或这些类之一(d-{xs,sm,md,lg,xl}-none)
原因是类更改display属性的值 ,其中值是以下之一:
- none
- inline
- inline-block
- block
- table
- table-cell
- table-row
- flex
- inline-flex
关于使用插件iscroll.js实现导航条的滑动
水平滑动需要设置滑动方向
var myScroll = new IScroll('.tab_box',{
/*设置水平滑动,不允许垂直滑动*/
scrollX: true, scrollY: false
});
其它注意事项
设置导航栏的高度时,应设置其中子元素的高度,不然导航栏的高度固定了,在屏幕尺寸变小时,其中子元素无法撑开下面的元素,如下: