一款json数据的动态图文网格布局，点击每一个图文内容，都有一个对应的弹窗，显示详细的大图片和文字内容，可以点击“上一条”或“下一条”进行图文内容切换，也可以点击“关闭”结束阅读。
页面的head部分，需引入页面的样式文件，代码如下：
<link type="text/css" rel="stylesheet" href="css/style.css">页面的body部分，需设置好json数据列表的ul容器和切换按钮等内容，代码如下：
<!-- 网格 -->
<ul class="posts-box"><!-- JSON数据列表 --></ul>
<!-- 弹窗 -->
<div class="modal" id="modal-name">
<div class="modal-sandbox"></div>
<div class="modal-box">
<div class="modal-header">
<img src="" class="inner-img" alt="">
</div>
<div class="modal-body">
<h2 class="inner-title"></h2>
<div class="inner-text"></div>
<button class="prev-post">上一条</button>
<button class="next-post">下一条</button>
<button class="close-post">关 闭</button>
</div>
</div>
</div>页面的底部，需引入jQuery库和本地JS文件，代码如下：
<script type="text/javascript" src='js/jquery.min.js'></script>
<script type="text/javascript" src="js/index.js"></script>
系统已开启自动识别垃圾评论机制，识别到的自动封号，下载出错或者资源有问题请联系全栈客服QQ 1915635791