建站学习网,专业提供各类建站教程,网页素材,SEO资讯等建站资源!

网站模板_网站源码_网站素材_建站教程_建站学习网

当前位置:建站学习网 > 织梦教程 > 织梦技巧 >

织梦dedecms调用栏目导航并生成二级下拉菜单

更新时间:2017-03-04整理编辑:建站学习网阅读:0
  织梦Dedecms调用栏目导航并生成二级下拉菜单 ,自带标签生成相信大家都知道,也很简单。
 
  织梦Dedecms默认的生成标签是这样的:
 
  代码如下
  {dede:channel type=’top’ row=’10′ currentstyle=“<li class=’hover’><a href=’~typelink~’ ~rel~><span>~typename~</span></a></li>“}
  <li><a href=’[field:typeurl/]‘ [field:rel/]><span>[field:typename/]</span></a></li>
  {/dede:channel}
 
  这个并不带有二级菜单,这里有一串代码,简单生成并带有下拉效果的二级菜单代码如下:
 
  CSS代码:
  代码如下
  .zb { list-style:none; text-align:left; position:absolute; z-index:99999; margin:0px; padding:0px !important; top:37px; left:0px; background:#009900; width:130px; display:none }
  .zb li{ text-align:left ; line-height:30px !important; height:30px; width:130px; }
  .r{ margin-left:10px; font-weight:normal}
  .nav_cc li{ float:left;line-height:37px;  font-weight:bold; color:#fff; font-family:黑体;}
  .nav_cc ul{ padding-left:20px}
  .nav_cc li a:link,.nav_cc li a:visited{ font-size:14px; color:#fff; margin:auto 15px}
  .nav_cc li a:hover{ color:#f00}
  .hover{color:#f00}
 
  带有织梦标签的html:
 
  代码如下
  <SCRIPT src=".min.js"></SCRIPT> //引入要用的js
  <div class="nav_cc" style="overflow:inherit">
  <ul id="shanmao">
  <li><a href='{dede:global.cfg_cmsurl/}/'><span>主页</span></a> |</li>
  {dede:channelartlist  row=8}
  <li style="position:relative;"><a href="{dede:field name='typeurl'/}">{dede:field name='typename'/}</a> |
  <ul class="zb">
  {dede:sql sql='Select * from dede_arctype where reid=~id~  ORDER BY id limit 0,17'}
  <li><a href='/plus/list.php?tid=[field:id/]' style="font-weight:normal">[field:typename/]</a></li>
  {/dede:sql}
  </ul></li>
  {/dede:channelartlist}
  <li><a href="{dede:global.cfg_cmsurl/}/plus/guestbook.php">技术问答</a> |</li>
  </ul>
  </div>
 
  最后是下拉菜单执行代码:
 
  代码如下
  <script>
  $(document).ready(function(){
  $("#shanmao li").hover(function(){
  $(this).children(".zb").slideDown(1000);
  },function(){
  $(this).children(".zb").slideUp(0);
  });
  });
  </script>

本文网址:https://www.dedexuexi.com/dedejiaocheng/zmjq/2541.html

本站部分文章搜集与网络,如有侵权请联系本站,转载请说明出处。

收藏此文 赞一下!() 打赏本站

如本文对您有帮助,就请建站学习网抽根烟吧!

支付宝打赏
微信打赏
织梦dedecms栏目页如何添加数字递增 数字123456
« 上一篇2017年02月28日
织梦dedecms后台/会员/留言板验证码关闭
2017年02月28日下一篇 »
  • 迅睿CMS根据栏目id来调用栏目信息
    0阅读
    迅睿CMS如何根据栏目id来调用栏目信息?独立模块栏目函数:dr_cat_value("模块目录", 栏目ID, "输出字段")共享模块栏目函数://写法1dr_share_cat_value(栏目ID, "输出字段")//写法2{category module=share id=1}{$t.url...
  • 迅睿CMS判断语句if写法
    0阅读
    格式一{if$模板变量运算符$模板变量} 模板内容{/if}{if$aaa!=$bbb}表示前面变量值不等于后面值{/if}格式二{if$模板变量1运算符$模板变量} 模板内容1{else} 模板内容2{/if}{if$aaa!=$bbb}表示前面变量值不等于后面值{else}表示反之状态,也就是相...
  • 织梦系统怎么根据IP获取当地的天气预报
    0阅读
  • 织梦DedeCMS手机端文章内容图片设置自适应屏幕的方法
    0阅读
    织梦dedecms默认的文章内容里面的图片是固定大小的,这样在手机端里面就可能会导致图片不能完整显示,甚至把屏幕撑开,这样非常不友好,所以这里就给大家分享一个方法,让手机端的文章内容里面的图片能够自适应图片大小。 方法如下: 找到并打开手机端的文章内容页模板,将里面的{dede:field.body...
  • 织梦系统中怎么查看站长日志(蜘蛛的爬行痕迹) 网站后台日志
    0阅读
    织梦系统中怎么查看站长日志(蜘蛛的爬行痕迹) 一般空间都会独立出来一个文件夹命名为log这里就是放日志的地方 站长日志,我都在到服务器上面下载的。 织梦系统中怎么查看站长日志(蜘蛛的爬行痕迹):一般空间都会独立出来一个文件夹命名为log这里就是放日志的地方 织梦的模板怎么看网站日志:楼主可能是新手吧...
 
QQ在线咨询