普通模版实现瀑布流 2.5

把附件中的redef.js  bg_waterfall.png、bg_pgbtn.png移动至当前模板图片目录

把forumdisplay_list.htm上传到 当前使用的模版forum\forumdisplay_list.htm 覆盖前备份

在正在使用的模板目录下common\extend_common.css里最下方添加

1. /* 瀑布流布局 by Pony 1204121803 */
   
2. .waterfall { position: relative; margin-top: 15px; }
   
3.         .waterfall li { margin: 0 10px 10px 0; padding: 0 0 3px; text-align: left; border-width: 1px 0 0; border-top: 1px solid #EAEAEA; background: url({STYLEIMGDIR}/bg_waterfall.png) no-repeat 100% 100%; }
   
4.         .waterfall .c, .waterfall h3 { padding: 10px; border: solid #EAEAEA; border-width: 0 1px; background-color: #F8F8F8; }
   
5.                 .waterfall .c { overflow: hidden; padding-bottom: 0; max-height: 800px; }
   
6.                 .waterfall .c .nopic { display: block; background:{WRAPBG} url({IMGDIR}/nophototiny.png) no-repeat 50% 50%; cursor: pointer; }
   
7.         .waterfall .auth { padding: 0 10px 10px; border-width: 0 1px 1px; border-style: solid; border-color: transparent #EAEAEA #B9B9B9; background: #F8F8F8; }
   
8.                 .waterfall .auth img { display: inline-block; margin: 0 1px; }
   
9. /* 大分页按钮 */
   
10. .pgbtn { margin: 5px 0 10px; }
    
11. .pgbtn a { display: block; height: 40px; line-height: 40px; letter-spacing: 5px; text-align: center; border: 1px solid #DCDCDC; background: #F5F5F5 url({STYLEIMGDIR}/bg_pgbtn.png) repeat-x 0 0; font-size: 14px; outline: none; border-radius: 5px; box-shadow: 0 1px 0 #F5F5F5; }
    
12. .pgbtn a:hover { border-color: #BABABA; text-decoration: none; }
    
13. .pgbtn a:active { background: #EEE; border-color: #D0D0D0; box-shadow: none; }

复制代码

进入后台 界面-界面设置-主题列表页 把主题封面宽度设置为200  主题封面高度 设置为9999 ，更新缓存

把需要瀑布流的版块开启图片模式

喜欢的有福了呢

支持分享

如果再门户做应该怎么做

感谢··········

weixinjoy 发表于 2012-5-10 18:13
我也想做在门户

  只能找我  演示地址  http://info.qunai.net/plugin.php ... buliu:tiger_pubuliu

先回复,挣钱

楼主很棒！