K9 通用版 博客版 主题版 地方门户版 企业版 |   企业(ASP) 分类 使用 分享 疑问 模板 建议 帮助 错误 其他
+新建主题 [Ajax]
填写帐号密码即可完成注册
+新建话题 最新回复排序 最新主题排序 精华帖子

实用代码之2

1Next >

updatex 发表于:10-09-02 15:47 [添加收藏] 楼主 [回复] #Top#
updatex 人气:1502 积分:1556 金币:31088
VIP KC元老 灌水狂人
大家好,KingCMS中,一直没有当前文章,当前栏目这样的属性。
这个属性很重要,做什么用呢?
比如,生成一个栏目菜单,点击栏目菜单进入后,必然希望菜单栏这个栏目的菜单项改变一下样式,以便和其他菜单项目区分开。

没有这个功能,我们可以自己开创,过程很简单。
我以网站的左边导航菜单为例:
第一步:生成一个碎片,碎片名称:left_menu_article
  1. <ul>
  2. <div id="LeftMenu">
  3. {king:portal.article type="new" modelid="6" listid='(king:listid/)'}
  4. <li id='left_menu_{king:kid/}'>
  5. <div><a href="{king:path/}">{king:title/}</a></div>
  6. </li>
  7. {/king:portal.article}
  8. </ul>
  9. {king:block name='js_left_menu_article' /}
  10. </div>
复制代码
第二步:再生成一个碎片,碎片名称:js_left_menu_article
  1. <script language="javascript">
  2. active_left_menu = "left_menu_{king:listid/}";
  3. activeID = document.getElementById(active_left_menu);
  4. if(activeID)activeID.className="Active";
  5. </script>
复制代码
第三步:在自己的CSS文件内加入对应的CSS代码
  1. /* 左侧导航菜单 */

  2. #LeftMenu
  3. {
  4.         width:230px;
  5.         margin:0px auto;
  6. }

  7. #LeftMenu ul
  8. {
  9.         list-style-type:none;
  10.         margin:0px;
  11.         padding:0px;
  12. }

  13. #LeftMenu ul li
  14. {
  15.         border-bottom:solid 1px #A9A9A9;
  16.         padding:2px 0px;
  17. }

  18. /* 菜单项目 */

  19. #LeftMenu ul li div

  20. {
  21.         padding:6px 18px;
  22. }

  23. #LeftMenu ul li div a:link, #LeftMenu ul li div a:visited
  24. {
  25.         color:#343434;
  26.         text-decoration:none;
  27. }

  28. #LeftMenu ul li div a:hover
  29. {
  30.         color:#9D222B;
  31. }

  32. /* 激活的菜单项目 */

  33. #LeftMenu ul li.Active div

  34. {
  35.         background:url("../images/leftmenu_act_bg.gif") #ccc;
  36.         color:White;
  37. }

  38. #LeftMenu ul li.Active div a:link, #LeftMenu ul li.Active div a:visited
  39. {
  40.         color:White;
  41. }
复制代码
具体的效果,请参考:
http://www.bizark.net/about/intro.html

思考题:
上面只针对栏目菜单,对于文章列表也可以实现同样的效果,我的网站是实现了的,大家自己看看,如何改变上述的代码,从而实现文章列表的当前列表效果。
玩KingCMS,就是玩出自己的花样。
zongxiao08 发表于:11-04-26 20:49 沙发 [回复] #Top#
zongxiao08 人气:145 积分:1174 金币:3553
还啊
xiekewen 发表于:11-05-25 10:17 板凳 [回复] #Top#
xiekewen 人气:19 积分:253 金币:798
板凳
zhyc 发表于:11-10-02 14:22 4楼 [回复] #Top#
zhyc 人气:8 积分:381 金币:1341
不错!
无聊的飞翔 发表于:11-10-02 20:30 5楼 [回复] #Top#
无聊的飞翔 人气:402 积分:1752 金币:20053
KC元老
这样的帖子我见一次顶一次,虽然我没太明白
pgzx995 发表于:17-12-10 23:22 6楼 [回复] #Top#
pgzx995 人气:0 积分:802 金币:2165
我也不太明白,
zhyc 发表于:18-03-03 11:58 8楼 [回复] #Top#
zhyc 人气:8 积分:381 金币:1341
mark

1Next >

发表回复

帐号 匿名发布 审核后可见 [加载完整在线编辑器]
内容
验证码
KingCMS 内容管理系统

关于我们 联系我们 广告报价 付款方式 站点导航

Copyright © 2004-2015 Focuznet All rights reserved.

广州唯众网络科技有限公司 粤ICP备08008106号