javascript - 如何做出这种幻灯片凸显的效果?是用到了bootstrap吗?
伊谢尔伦
伊谢尔伦 2017-04-11 13:15:29
0
9
277


这种凸显的效果怎么实现的?

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

Antworte allen (9)
Peter_Zhu

科普时间~

  1. bootstrap不是一门技术, 这么说很外行. 多多少少是个程序员了, 不要被人笑话.

  2. 能用bootstrap写出来的, 用css + js一定能写出来, 反之不成立.

  3. 这个效果纯css就能写出来, 当然, 用js会更方便一些. 怎么写? 搜轮播图即可, 看起来不一样, 实质都是一样的

    左手右手慢动作

    如果想要现成的,搜索swiper

      刘奇

      前段时间看过一个jquery插件的实现 http://www.softwhy.com/demo/c...

      https://github.com/LikaiLee/C...

      凸显的实现原理也不复杂,就是绝对定位+z-index。

        左手右手慢动作

        请百度 swiper

          PHPzhong

          http://www.swiper.com.cn/api/...
          拿走不谢

            洪涛

            http://www.swiper.com.cn/api/...
            你要的效果,调整角度即可...

              大家讲道理

              这个不需要什么其他框架,基础的js+css就可以做到。
              层叠的实现大致通过zindex控制前后层次,scale缩放大小,再加一些position进行定位。
              js做一些控制效果,控制translateX等位置属性改变位置,变换大小等等。
              建议楼主自己多思考一下,然后不依靠插件直接自己写。写个demo后面在和网上的去对比下,不断丰富效果。

                大家讲道理

                swiper.js
                就可以了

                  小葫芦

                  试着用js+css自己写一个吧。

                  scale、opacity、transform、transition等css属性可以完成

                  另外,transitionEnd事件也可以调查下

                    Neueste Downloads
                    Mehr>
                    Web-Effekte
                    Quellcode der Website
                    Website-Materialien
                    Frontend-Vorlage
                    Über uns Haftungsausschluss Sitemap
                    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!