响应式图片

JavaScript

$(function(){
    baguetteBox.run('.baguetteBox');
});

HTML

<div class="baguetteBox gallery">
    <a href="img/2-1.jpg" 
        data-at-450="img/thumbs/2-1.jpg" 
        data-at-800="img/small/2-1.jpg" 
        data-at-1366="img/medium/2-1.jpg" 
        data-at-1920="img/big/2-1.jpg">
        <img src="img/thumbs/2-1.jpg"></a>
    <a href="img/2-2.jpg" 
        data-at-450="img/thumbs/2-2.jpg" 
        data-at-800="img/small/2-2.jpg" 
        data-at-1366="img/medium/2-2.jpg" 
        data-at-1920="img/big/2-2.jpg">
        <img src="img/thumbs/2-2.jpg"></a>
    <a href="img/2-3.jpg" 
        data-at-450="img/thumbs/2-3.jpg" 
        data-at-800="img/small/2-3.jpg" 
        data-at-1366="img/medium/2-3.jpg" 
        data-at-1920="img/big/2-3.jpg">
        <img src="img/thumbs/2-3.jpg"></a>
    <a href="img/2-4.jpg" 
        data-at-450="img/thumbs/2-4.jpg" 
        data-at-800="img/small/2-4.jpg" 
        data-at-1366="img/medium/2-4.jpg" 
        data-at-1920="img/big/2-4.jpg">
        <img src="img/thumbs/2-4.jpg"></a>
</div>

dowebok.com 说 明 下 载