亚洲一区二区三区无码少年_日韩亚洲欧美综合一区二区三区_国产精品成人69xxx_被主人狠狠调教打屁股_国产女厕所偷窥系列在线视频_老头猛挺进王进霞的体内视频_日本女同伦理片_一级毛片特黄视频免费观看_国产成人无码免费看视频软件

Chocolat.js的使用為網(wǎng)頁增添色彩

作者：龍 時間：2018-07-18 瀏覽：

1.簡介

Chocolat.js 使您能夠顯示一個或多個圖像在同一頁面上。給用戶展示一組圖片縮略圖，可以顯示全頁或塊。Chocolat.js 可以很好地處理所有主要的瀏覽器。它在下面這些瀏覽器測試通過：IE7+，火狐，Chrome，Opera 和 Safari 瀏覽器

2.demo演示

2.1 引入庫文件

    <link rel="stylesheet" href="css/chocolat.css">
    <script src="js/jquery-1.9.1.min.js"></script>
    <script src="js/jquery.chocolat.min.js"></script>

2.2 demo源碼

    <!--css-->
        .part01 a {
            font-size: 20px;
            color: #000;
        }
        
        .part01 a span {
            display: inline-block;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: rgba(255, 255, 255.5);
            line-height: 40px;
            text-align: center;
        }
    
    <!--html -->
    <div id="part01" class='part01 w1200'>
        <a class="chocolat-image" href="img/g-1.jpg" title="艾迪A8">
            <span>1</span>
        </a>
        <a class="chocolat-image" href="img/g-2.jpg" title="法拉利">
            <span>2</span>
        </a>
        <a class="chocolat-image" href="img/g-3.jpg" title="凱迪拉克">
            <span>3</span>
        </a>
    </div>
    
    <!--js-->
    $(function() {
        $('#part01').Chocolat({
            imageSize: 'contain',
            loop: true
        });
    })
    
    

2.3參數(shù)詳解

同樣在官方文檔還有更多的參數(shù)可以設(shè)定