滾動後的頂部工具欄，在jQuery

Question

我在magento管理員存儲中看到了此工具欄。在頁面向下滾動並且菜單消失之後，我想要一個頂部工具欄以透明背景的形式出現，就像前面提到的管理面板中一樣。

Answer 1

的HTML：

<div class="auto-style1"> 
    <a href="#top" id="top-link">Top of Page</a> 
</div> 

的CSS：

.auto-style1 { text-align: right;} 

的JavaScript：

jQuery.fn.topLink = function(settings) 
{ 
    settings = jQuery.extend({ 
    min: 1, 
    fadeSpeed: 200 
    }, settings); 
    return this.each(function() { 
    //listen for scroll 
    var el = $(this); 
    el.hide(); //in case the user forgot 
    $(window).scroll(function() { 
     if($(window).scrollTop() >= settings.min) 
     { 
     el.fadeIn(settings.fadeSpeed); 
     } 
     else 
     { 
     el.fadeOut(settings.fadeSpeed); 
     } 
    }); 
    }); 
}; 
//usage w/ smoothscroll 
$(document).ready(function() { 
    //set the link 
    $('#top-link').topLink({ 
    min: 400, 
    fadeSpeed: 500 
    }); 
    //smoothscroll 
    $('#top-link').click(function(e) { 
    e.preventDefault(); 
    $.scrollTo(0,300); 
    }); 
});