图片列表模式美化：滑动渐变，美化样式等FORX2.5/3.0

popuppp · 发表于 2013-5-18 21:15:22

本帖最后由 popuppp 于 2013-5-18 21:48 编辑

X2.5看这里：https://discuz.dismall.com/thread-3260999-1-1.html

演示：驻马店论坛 http://bbs.zmd5.com/forum-238-1.html

修改方法：
1、打开 template/default/forum中的forumdisplay_list.htm
搜索既 <ul id="waterfall" class="ml waterfall cl">……</ul> 之间

<ul id="waterfall" class="ml waterfall cl">
<li style="width:{$waterfallwidth}px;">
<div style="position:absolute;margin:1px;padding:2px;background:#FFF">
<input onclick="tmodclick(this)" type="checkbox" name="moderate[]" value="$thread[tid]" />
<input type="checkbox" disabled="disabled" />
<input type="checkbox" disabled="disabled" />
</div>
<div class="c cl">
<a href="forum.php?mod=viewthread&tid=$thread[tid]&{if $_GET['archiveid']}archiveid={$_GET['archiveid']}&{/if}extra=$extra" {if $thread['isgroup'] == 1 || $thread['forumstick'] || CURMODULE == 'guide'} target="_blank"{else} onclick="atarget(this)"{/if} title="$thread[subject]" class="z">
<img src="$thread[coverpath]" alt="$thread[subject]" width="{$_G[setting][forumpicstyle][thumbwidth]}" />
<span class="nopic" style="width:{$_G[setting][forumpicstyle][thumbwidth]}px; height:{$_G[setting][forumpicstyle][thumbwidth]}px;"></span>
</a>
</div>
<h3 class="xw0">
<a href="forum.php?mod=viewthread&tid=$thread[tid]&{if $_GET['archiveid']}archiveid={$_GET['archiveid']}&{/if}extra=$extra"$thread[highlight]{if $thread['isgroup'] == 1 || $thread['forumstick']} target="_blank"{else} onclick="atarget(this)"{/if} title="$thread[subject]">$thread[subject]</a>
</h3>
<div class="auth cl">
<cite class="xg1 y">
{lang like}: $thread[recommends]0
  {lang reply}: <a href="forum.php?mod=viewthread&tid=$thread[tid]&extra=$extra" title="$thread[replies] {lang reply}">$thread[replies]</a>
</cite>
<a href="home.php?mod=space&uid=$thread[authorid]">$thread[author]</a> $verify[$thread[authorid]]
$_G[setting][anonymoustext]
</div>
</li>
</ul>

复制代码

替换为

<ul class="ml mlt mtw cl">
<li style="width:{$_G[setting][forumpicstyle][thumbwidth]}px;">
<div style="position:absolute;margin:1px;padding:2px;background:#FFF">
<input onclick="tmodclick(this)" type="checkbox" name="moderate[]" value="$thread[tid]" />
<input type="checkbox" disabled="disabled" />
<input type="checkbox" disabled="disabled" />
</div>
<div class="c cl">
<a href="forum.php?mod=viewthread&tid=$thread[tid]&{if $_GET['archiveid']}archiveid={$_GET['archiveid']}&{/if}extra=$extra" {if $thread['isgroup'] == 1 || $thread['forumstick'] || CURMODULE == 'guide'} target="_blank"{else} onclick="atarget(this)"{/if} title="$thread[subject]" class="z">
<img src="$thread[coverpath]" alt="$thread[subject]" width="{$_G[setting][forumpicstyle][thumbwidth]}" />
<span class="nopic" style="width:{$_G[setting][forumpicstyle][thumbwidth]}px; height:{$_G[setting][forumpicstyle][thumbwidth]}px;"></span>
</a>
</div>
<p></p>
<dd style="width:{$_G[setting][forumpicstyle][thumbwidth]}px;">
<a href="forum.php?mod=viewthread&tid=$thread[tid]&{if $_GET['archiveid']}archiveid={$_GET['archiveid']}&{/if}extra=$extra"$thread[highlight]{if $thread['isgroup'] == 1 || $thread['forumstick']} target="_blank"{else} onclick="atarget(this)"{/if} title="$thread[subject]"></a>
<em>$thread[author]
$_G[setting][anonymoustext]
<em title="$thread[cover] {lang pics}">($thread[cover]P)</em></em> </dd>
</li>
</ul>

复制代码

2、打开template/default/common中的module.css

搜索以下代码，既：Last Modify: Pony 11121511下面的部分

.mlt {}
.mlt li { display: inline; margin: 0 4px 10px; padding-top: 5px; border: 1px solid {SPECIALBG}; border-bottom-color: {SPECIALBORDER}; background: #FFF; text-align: left; }
.mlt .sum { display: inline-block; padding: 0 5px; height: 16px; line-height: 16px; border-radius: 5px; background: {SPECIALBG}; }
.mlt .pin { background: #7B3; color: #FFF; }
.mlt .digest { background: #0BC; color: #FFF; }
.mlt .c .nopic { display: block; background:{WRAPBG} url({IMGDIR}/nophototiny.png) no-repeat 50% 50%; cursor: pointer; }
.mlt img.vm { display: inline; }
.mlt h3 { height: 30px; line-height: 30px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mlt li .cl { height: 18px; overflow: hidden; }
.mlt li .c { height: auto !important; }
.mlt li span { display: inline; color: {TABLETEXT}; }

复制代码

替换为

游客，如果您要查看本帖隐藏内容请回复

然后进后台，更新下CSS缓存即可.方法无错，认真阅读修改，如果搞不定，可以联络我修改，收一定费用的。
AD：恒泰华 http://www.hthtoy.com/

1314学习网 · 发表于 2013-5-18 21:28:00

前排过来支持下

popuppp · 发表于 2013-5-18 21:49:07

X3的修改，去掉了瀑布流，请考虑后修改。

斯威特の潇枫 · 发表于 2013-5-18 22:26:24

不错啊，很漂亮

忘了自己 · 发表于 2013-5-19 13:58:35

非常好的帖子，感谢楼主

双IP精品合租 · 发表于 2013-5-19 14:30:52

来支持下

gushiyue · 发表于 2013-5-19 15:39:16

提示: 作者被禁止或删除内容自动屏蔽

可爱的轩轩 · 发表于 2013-5-19 16:33:26

驻马店的都是精品啊

发表于 2013-5-20 10:02:01

转播微博[tthread=Rey-fu2k, 宠物小精灵之沧海王子]http://app.qlogo.cn/mbloghead/b2ee8e387428cd92dde0[/tthread]

saintpower · 发表于 2013-5-28 14:25:21

嗯，不错的东东！！

		自动登录	找回密码
密码			立即注册

[发布] 图片列表模式美化：滑动渐变，美化样式等FORX2.5/3.0