JS下拉页面时一个横幅的样式和js

整理之前的代码，发现有一个js，就是页面往下浏览时，上面的商品名称和购买按钮在页面上方悬浮的，就整理下来，代码如下：

 <script type="text/javascript">
     window.onload = function () {
         //var nav =$("#divnav");
         var nav = document.getElementById('divnav');
         window.onscroll = function () {
             var top = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop; //w3c，各ie的兼容
             if (top >= 40) {
                 addClass(nav, 'nav-fixed');
             } else {
                 removeClass(nav, 'nav-fixed');
                 }
             };
         };
     function addClass(ele, classname) {
         var oldClass = ele.className;
         var pattern = new RegExp('(^|\\s)' + classname + '(\\s|$)');
         if (!pattern.test(oldClass)) {
             ele.className += ' ' + classname;
         }
     }
     function removeClass(ele, classname) {
         var oldClass = ele.className;
         var pattern = new RegExp('(^|\\s)' + classname + '(\\s|$)');
         if (pattern.test(oldClass)) {
             ele.className = ele.className.replace(pattern, ' ');
         }
     }
 </script>

html页面上的东西，如下：

<div id="divnav" class="divnav">
    <div id="nav">
        <table class="nav-table">
            <tr>
                <td class="table-border"></td>
                <td class="td-left">
                    <a>商品名</a>
                </td>
                <td class="td-reg">
                    <asp:Button ID="btbuy" class="btn-primary" Style="font-family: Microsoft Yahei; text-decoration: none; font-size: 13px;" runat="server" Text="点击订购" OnClick="btbuy_Click" />
                </td>
                <td class="table-border"></td>
            </tr>
        </table>
    </div>
</div>

几个css样式：

 .table-border{ width: 10%;}
 .nav-table{width: 100%;height: 100%;}
 .td-left{ width: 40%; text-align: left;}
 .div-left{width: 100%;text-align: left;}
 .td-reg{ text-align: right;}
 .td-cent{ text-align: center;}
 .btn-primary{background:#ff6700;border-color:#ff6700;color: #fff;width: 130px;height: 40px;font-size: 14px;}
 .btn-primary:hover{background-color:#f25807;border-color:#f25807;color:#fff}