zhangqi
/
myblog-1


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204
							<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>大可乐的博客</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">

    <!-- Bootstrap styles -->
    <link rel="stylesheet" href="/Public/css/bootstrap.min.css">
   
    <!-- Font-Awesome -->
    <link rel="stylesheet" href="/Public/css/font-awesome/css/font-awesome.min.css">

    <!-- Google Webfonts -->
    <link href="/Public/css/m.css" rel='stylesheet' type='text/css'>

    <!-- Styles -->
    <link rel="stylesheet" href="/Public/css/style.css" id="theme-styles">
    <link rel="stylesheet" href="/Public/mark/css/editormd.css">
    
<style>
#infomore{
    background-color: #31c7f4;
}
    #infomore:hover{
        background-color:#428bca;
    }
</style>


</head>
<body>
    <header>
        <div class="widewrapper masthead">
            <div class="container">
                <a href="<?php echo U('Index/index');?>" id="logo">
                    <img src="/blog-demo/public/img/demo2.jpg" alt="clean Blog">
                </a>

                <div id="mobile-nav-toggle" class="pull-right">
                    <a href="#" data-toggle="collapse" data-target=".clean-nav .navbar-collapse">
                        <i class="fa fa-bars"></i>
                    </a>
                </div>

                <nav class="pull-right clean-nav">
                    <div class="collapse navbar-collapse">
                        <ul class="nav nav-pills navbar-nav">
                          
                            <li>
                                <a href="<?php echo U('Index/index');?>">首页</a>
                            </li>
                            <li>
                                <a href="<?php echo U('Index/about');?>">关于</a>
                            </li>
                            <li>
                                <a href="<?php echo U('Index/contact');?>">联系方式</a>
                            </li>                        
                        </ul>
                    </div>
                </nav>        

            </div>
        </div>

        <div class="widewrapper subheader">
            <div class="container">
                <div class="clean-breadcrumb">
                    <a href="#">Blog</a>
                </div>

                <div class="clean-searchbox">
                    <form action="#" method="get" accept-charset="utf-8">
                        <input class="searchfield" id="searchbox" type="text" placeholder="Search">
                        <button class="searchbutton" type="submit">
                            <i class="fa fa-search"></i>
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </header>

    
    <div class="widewrapper main">
        <div class="container">
            <div class="row">
                <div class="col-md-8 blog-main" id="">
                    <?php if(is_array($showtype)): $i = 0; $__LIST__ = $showtype;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?><div class="col-md-6 col-sm-6" id="water" style="height: 540px;margin-top: 20px;">
                            <article class=" blog-teaser">
                                <header>
                                    <img src="<?php echo ($vo['a-img']); ?>" alt="">
                                    <h4><a href="<?php echo U('Index/single',array('id'=>$vo['id']));?>" ><?php echo ($vo['a-title']); ?></a></h4>
                                    <span class="meta">发布时间：<?php echo ($vo['a-time']); ?>, </span>
                                    <span class="meta">作者：<?php if($vo['a-auther'] == null): ?>佚名<?php else: echo ($vo["a-auther"]); endif; ?></span>
                                    <hr>
                                </header>
                                <div class="body" style="height:100px;overflow: hidden;" escape="false">
                                    <?php echo (htmlspecialchars_decode($vo['a-jianjie'])); ?>
                                </div>
                                <div class="clearfix">
                                    <a href="<?php echo U('Index/single',array('id'=>$vo['id']));?>" class="btn btn-primary">Read more</a>
                                </div>
                            </article>
                        </div><?php endforeach; endif; else: echo "" ;endif; ?>
                    <!-- <div style="text-align: center;">
                        <a href="<?php echo U('Index/index',array('more'=>'more'));?>" class="btn btn-info" id="infomore" style="border-radius: 5px;">加载更多</i></a>
                    </div> -->
                </div>
                <aside class="col-md-4 blog-aside">
                    
                    <!-- <div class="aside-widget">
                        <header>
                            <h3>Featured Post</h3>
                        </header>
                        <div class="body">
                            <ul class="clean-list">
                                <li><a href="">Clean - Responsive HTML5 Template</a></li>
                                <li><a href="">Responsive Pricing Table</a></li>
                                <li><a href="">Yellow HTML5 Template</a></li>
                                <li><a href="">Blackor Responsive Theme</a></li>
                                <li><a href="">Portfolio Bootstrap Template</a></li>
                                <li><a href="">Clean Slider Template</a></li>
                            </ul>
                        </div>
                    </div>
                
                    <div class="aside-widget">
                        <header>
                            <h3>Related Post</h3>
                        </header>
                        <div class="body">
                            <ul class="clean-list">
                                <li><a href="">Blackor Responsive Theme</a></li>
                                <li><a href="">Portfolio Bootstrap Template</a></li>
                                <li><a href="">Clean Slider Template</a></li>
                                <li><a href="">Clean - Responsive HTML5 Template</a></li>
                                <li><a href="">Responsive Pricing Table</a></li>
                                <li><a href="">Yellow HTML5 Template</a></li>
                            </ul>
                        </div>
                    </div> -->

                    <div class="aside-widget">
                        <header>
                            <h3>Tags</h3>
                        </header>
                        <div class="body clearfix">
                            <ul class="tags">
                                <?php if(is_array($tags)): $i = 0; $__LIST__ = $tags;if( count($__LIST__)==0 ) : echo "" ;else: foreach($__LIST__ as $key=>$vo): $mod = ($i % 2 );++$i;?><li><a href="<?php echo U('Index/search',array('type'=>$key));?>"><?php echo ($key); ?>（<?php echo ($vo); ?>）</a></li><?php endforeach; endif; else: echo "" ;endif; ?> 
                            </ul>
                        </div>
                    </div>
                </aside>
            </div>
        </div>
    </div>


    <footer>
        <div class="widewrapper copyright">
                Copyright 2019 More Templates <a href="#" target="_blank" title="我爱大可乐">我爱大可乐的博客</a>
        </div>
    </footer>
    
    <script src="/Public/jquery/jquery.min.js"></script>
    <script src="/Public/js/bootstrap.min.js"></script>
    <script src="/Public/js/modernizr.js"></script>
    <script type="text/javascript" src="/Public/mark/editormd.js"></script>

<script src="/Public/js/waterfall.js"></script>
<script>
window.onload  = function () {
    $('.col-md-8 blog-main').WaterFall();
}
</script>
    <script type="text/javascript">
        window.onload = function(){
            //每个格格不一定往自己序号%3这个列插入，看哪个列目前最矮，插在哪里=
            //得到所有的grid
            // $grids = $(".col-md-6 col-sm-6");        
             //用一个数组存储当前三个列的总高度
             var colHeight = [0,0,0];  
             // console.log(colHeight);
             // 遍历小格格
             $(".col-md-6 col-sm-6").each(function(){
                 //找一下当前的最短列是谁
                 var minValue = _.min(colHeight); //colHeight里面的最小的值！
                 //看一下最短列出现在index几的位置上
                 var minIndex = _.indexOf(colHeight,minValue);//最短的值的下标
                // console.log(minIndex);
                 $(this).css({
                     "top" : minValue ,
                     "left" : minIndex * 270
                 });
                 colHeight[minIndex] += $(this).outerHeight() + 20;
                 // console.log(colHeight[minIndex]);
             })
         }
    </script>

</body>
</html>