Grid JQuery具有每个功能

时间:2015-07-19 17:23:06

标签: jquery grid each

我不知道该怎么做:用每个jquery滚动一个包含9个图像的数组,并用三列动态构建一个网格。对于要单击的每个图像,这应该随着淡入淡出效果消失

1 个答案:

答案 0 :(得分:0)

这是你的意思吗?

<style>
    #print{width: 141px;height: 141px;margin: auto;}
    #print div{width:35px;height:35px;margin: 5px;border: 1px solid #000;float:left;}
    #print div img{width:35px;height:35px;}
</style>
<script>
    var r = '';
    array = ['1','2','3','4','5','6','7','8','9'];
    for(var i = 0 ;i < 9; i++){
        r += '<div><img src="https://www.gravatar.com/avatar/b704656821750c1f0abf7832da997248?s=32&d=identicon&r=PG&f=1" /></div>'; 
        //when replace your images names at array replace src with this src="images/'+array[i]+'.jpg"
    }
    function fadeOutFunction(){
        img = $(this).children('img');
        img.fadeToggle();
    }
    $(document).ready(function(e) {
        $('#print').html(r);
        $('#print').delegate('div','click',fadeOutFunction);
    });
</script>
<div id="print"></div>