通过jQuery和Bootstrap来分别实现轮播图

一、通过Bootstrap来实现轮播图

准备好Bootstrap所需的包，轮播图所需的图片，然后就可以开始来写轮播图了。

    

        

            

                

                    

                    

                    

                    

                    

                    

                    

                    

                
                

                    

                    

                    

                    

                    

                    

                    

                    

                
                ‹
                ›
            
        
    

然而，运行上述代码，你会发现该轮播图无法自动播放，这是因为没有设置carousel（）方法。

下面来设置轮播项自动播放：

效果图：

二、通过jQuery来实现轮播图

相比Bootstrap，jQuery实现轮播图就复杂多了。不要忘了导入jQuery所需要的包。
样式：

div：

    

        

        

        

        

        

        

        

        

    
    
    

        <
        >
    
    

        
            
            
            
            
            
            
            
            
    

核心js代码：

效果图：