防康源栏目导航，柯林nv特效

效果图

代码：

<div id=”nv”>
<div class=”breadcrumb”><span class=”crust”> [nv] </span></div>
</div>
<script type=”text/javascript” language=”javascript”>
var nv =document.getElementById(“nv”).innerHTML;
nv=nv.replace(/当前/g, “”);
nv=nv.replace(/&gt;&gt;/g, “<font class=’arrow’><span></span></font></span><span class=’crust’>”);
document.getElementById(“nv”).innerHTML=nv;
</script>
使用wml调用，适配于柯林程序
将下面的代码添加到你网站全局可用的css中
<style type=”text/css”>
.breadcrumb { font-size: 13px; background: #f0f7fc; border: 1px solid #a5cae4; overflow: hidden; zoom: 1; }
.breadcrumb .crust:hover a, span.crumb { background-color: #d7edfc }
.breadcrumb .crust:hover span.crumb { background-color: #d7edfc }
.breadcrumb .crust:hover .arrow span { border-left-color: #d7edfc }
.breadcrumb .crust { display: block; float: left; position: relative; zoom: 1 }
.breadcrumb .crust:last-child a { font-weight: bold }
.breadcrumb .crust:first-child a { padding-left: 10px; border-top-left-radius: 5px; -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; -khtml-border-top-left-radius: 5px; border-bottom-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-bottom-left-radius: 5px }
.breadcrumb .crust a, span.crumb { text-decoration: none; background-color: #f0f7fc; padding: 0 10px 0 18px; margin-bottom: -1px; border-bottom: 1px solid #a5cae4; outline: 0 none; display: block; line-height: 24px; _border-bottom: none }
.breadcrumb .crust .arrow { border: 12px solid transparent; border-right: 1px none black; border-left-color: #a5cae4; display: block; position: absolute; right: -12px; top: 0px; z-index: 1; width: 0px; height: 0px }
.breadcrumb .crust .arrow span { border: 12px solid transparent; border-right: 1px none black; border-left-color: #f0f7fc; display: block; position: absolute; left: -13px; top: -12px; z-index: 2; white-space: nowrap; overflow: hidden; text-indent: 9999px; width: 0px; height: 0px }
.breadcrumb .crust .arrow { _display: none }
</style>