大佬教程收集整理的这篇文章主要介绍了【Angular】——BootStrap+Swiper实现手机端滑动窗口，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
经过大家的努力，滑动效果实现了~~~哈哈哈！！
做出来了，才觉得，这么简单......但建议：若只做移动端可以选择Ionic或者mui。他们更针对移动端，封装的内容也比较丰富。
博客标题叫BootStrap+Swiper实现手机端滑动窗口，但其实和bootstrap没有任何关系，只是因为Boostrap没有滑动效果，才加入了Swiper。它们结合在一起，完美的实现了项目中的需求......（如下图，滑动屏幕，显示下一题）
回归正题，既然项目选定了Bootstrap，又要实现移动端滑动效果，遇到问题去解决就是了。过程中几个小师弟给了很大的助攻。
确定bootstrap没有此效果，便开始找能实现滑动效果的插件，最后锁定Swiper。
其实它的官网上有详细的介绍（为了兼顾更多人，我就放中文文档了）：Swiper中文文档
但这些教程是针对html、js的。如何放入我们的Angular2呢。大同小异，因为ts本质也是js，所以没有太大差别。在此将源码分享，希望节省一些有同样问题的同事的时间。
引入swiper.min.css
然后在项目的index.html中引入：
href="assets/bootstrap-3.3.7-dist/css/swiper.min.css" rel="stylesheet">最后，在相应的组件中应用即可：
HTML中有这三个div。并在第三个div内放入你想要实现滑动的div
然后在ts中补充：
OK！这样滑动效果就实现了。另：Swiper还有很多其他样式滑动效果，可以参考官方文档选择最适合自己项目的滑动效果。
另：class=swiper-slide的div样式可以设置为
overflow: scroll（overflow超出部分如何处理。scroll：添加滚轮。hidden：超出部分隐藏，即不显示）
其外层设置为
overflow: hidden可以实现根据 纵向内容的多少决定是否可以滑动。
以上是大佬教程为你收集整理的【Angular】——BootStrap+Swiper实现手机端滑动窗口全部内容，希望文章能够帮你解决【Angular】——BootStrap+Swiper实现手机端滑动窗口所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。