Immersive Slider图片轮播html代码

<div id="immersive_slider">
    <div class="slide" data-blurred="img/slide1_blurred.jpg">
        <div class="content">
            <h2>
                <a href='https://jy.tp.yuanmeng.life/js/540.html' target='_blank'>jQuery圣诞节小雪花</a>
            </h2>
            <p>
                christmassnow下雪插件可以给你的网站增添圣诞的气息,让你的用户感觉在过圣诞节。
            </p>
        </div>
        <div class="image">
            <img src="img/slide1.jpg" alt="Slider 1">
        </div>
    </div>
    <div class="slide" data-blurred="img/slide2_blurred.jpg">
        <div class="content">
            <h2>
                <a href='https://jy.tp.yuanmeng.life/js/542.html' target='_blank'>jQuery仿京东弹出层</a>
            </h2>
            <p>
                本文通过Bootstrap的modal方法并结合Ajax显示京东登录层，bootstrap插件的modal方法已经封装在jquery.js里面。
            </p>
        </div>
        <div class="image">
            <img src="img/slide2.jpg" alt="Slider 2">
        </div>
    </div>
    <div class="is-nav">
        <a href="#" class="is-prev">«</a>
        <a href="#" class="is-next">»</a>
    </div>
</div>

演示一：默认配置

$("#immersive_slider").immersive_slider({
    container: ".main"
});

演示二：<a href='https://jy.tp.yuanmeng.life/jquery/demo/6/631/index2.html' target='_blank'>淡入淡出</a>

$("#immersive_slider").immersive_slider({
    container: ".main", //目标容器
    animation: "fade",//动画效果：淡入淡出
    autoStart: false //是否自动轮播
});

演示三：<a href='https://jy.tp.yuanmeng.life/jquery/demo/6/631/index3.html' target='_blank'>反弹动画</a>

$("#immersive_slider").immersive_slider({
    container: ".main",
    animation: "bounce",
    autoStart: false
});

演示四：<a href='https://jy.tp.yuanmeng.life/jquery/demo/6/631/index4.html' target='_blank'>垂直滚动</a>

$("#immersive_slider").immersive_slider({
    container: ".main",
    animation: "slideUp",
    autoStart: false,
    loop: false //是否循环
});

演示四：<a href='https://jy.tp.yuanmeng.life/jquery/demo/6/631/index5.html' target='_blank'>向上反弹</a>(只在google浏览器生效)

$("#immersive_slider").immersive_slider({
    container: ".main",
    animation: "bounceUp",
    cssBlur: true
});