scroll up in public site

By default nop commerce has scroll up only in admin site. but need the same in customer site / public site only

Please advise on the implementation.

There are several ways to achieve the same!
You can use same functionality to add some js and css file contents to your public site.

But here I'm adding custom code to the header view at Nop.Web > Views > Shared > Header.cshtml:
HTML:

<p id="back-top">
   <a href="#top"><span></span>Back to Top</a>
</p>

CSS:

<style type="text/css">
    /*Back to top button*/
    #back-top {
        position: fixed;
        bottom: 30px;
        margin-left: -150px;
    }
        #back-top a {
            width: 108px;
            display: block;
            text-align: center;
            font: 11px/100% Arial, Helvetica, sans-serif;
            text-transform: uppercase;
            text-decoration: none;
            color: #bbb;
            /* background color transition */
            -webkit-transition: 1s;
            -moz-transition: 1s;
            transition: 1s;
        }

            #back-top a:hover {
                color: #000;
            }
        /* arrow icon (span tag) */
        #back-top span {
            width: 108px;
            height: 108px;
            display: block;
            margin-bottom: 7px;
            background: #ddd url('../../Content/Images/Arrows-Up-icon.png') no-repeat center center;
            /* rounded corners */
            -webkit-border-radius: 15px;
            -moz-border-radius: 15px;
            border-radius: 15px;
            /* background color transition */
            -webkit-transition: 1s;
            -moz-transition: 1s;
            transition: 1s;
        }

        #back-top a:hover span {
            background-color: #777;
        }
</style>

Javascript:

<script type="text/javascript">
    $(document).ready(function () {

        // hide #back-top first
        $("#back-top").hide();

        // fade in #back-top
        $(function () {
            $(window).scroll(function () {
                if ($(this).scrollTop() > 100) {
                    $('#back-top').fadeIn();
                } else {
                    $('#back-top').fadeOut();
                }
            });
            // scroll body to 0px on click
            $('#back-top a').click(function () {
                $('body,html').animate({
                    scrollTop: 0
                }, 800);
                return false;
            });
        });

    });
</script> 

It will display scroll up button.

Hi anbujeremiah, Divyang's solution is correct (in above post).

Here is another tutorial based on similar approach: How to add scroll to top button in nopCommerce