当从jquery请求中显示新内容时,Div内容会扩展

时间:2014-04-15 10:25:47

标签: jquery css overflow z-index expand

我已实施"Elastic Grid | JQuery Responsive Porfolio Plugin""Liquid Slider"

您将看到6个缩略图展开滑块div,但是当您单击缩略图时,滑块div不会展开。

我尝试过使用CSS来解决这个问题。溢出:自动(这会给我滚动条)不起作用。更改弹性网格的z-index也没有任何作用。

这是代码

<li>
    <div class="row clearfix">
        <div class="col-md-12">
            <h1 class="title" align="center">web design</h1>
        </div>
    </div>



    <div class="row clearfix">  
        <div class="col-md-12">
            <div id="elastic_grid_demo"></div>
            <script type="text/javascript" src="<?php echo home_url(); ?>/thumbgrid/js/elastic_grid.encode.js"></script>

            <script type="text/javascript">
                $(function(){
                    $("#elastic_grid_demo").elastic_grid({
                        'filterEffect': 'popup', // moveup, scaleup, fallperspective, fly, flip, helix , popup
                        'hoverDirection': true,
                        'hoverDelay': 0,
                        'hoverInverse': false,
                        'expandingSpeed': 500,
                        'expandingHeight': 500,
                        'items' :
                        [
                            {
                                'title'         : 'Web1',
                                'description'   : '<h2>Web1 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web1 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web1 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/1.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/1.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },
                            {
                                'title'         : 'Web2',
                                'description'   : '<h2>Web2 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web1 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web1 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/2.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/2.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },
                            {
                                'title'         : 'Web3',
                                'description'   : '<h2>Web3 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web3 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web3 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/3.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/3.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },
                            {
                                'title'         : 'Web4',
                                'description'   : '<h2>Web4 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web4 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web4 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/4.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/4.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },
                            {
                                'title'         : 'Web5',
                                'description'   : '<h2>Web5 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web5 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web5 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/5.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/5.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },
                            {
                                'title'         : 'Web6',
                                'description'   : '<h2>Web6 Delivery</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web6 Obejective</h2><p>Copy copy copy copy copy copy copy copy copy copy</p><h2>Web6 Performance</h2><p>Copy copy copy copy copy copy copy copy copy copy</p>',
                                'thumbnail'     : ['<?php echo home_url(); ?>/thumbgrid/images/web/thumbs/6.jpg'],
                                'large'         : ['<?php echo home_url(); ?>/thumbgrid/images/web/6.jpg'],
                                'button_list'   :
                                [
                                    { 'title':'Demo', 'url' : '#' },
                                    { 'title':'Download', 'url':'#'}
                                ],
                                'tags'          : ['Portrait']
                            },

                        ]
                    });
                });
            </script><div style="clear: both;"></div>
        </div>
    </div>
</li>
</ul>
</div>

有没有人能解决这个问题?

0 个答案:

没有答案