CCSJQUERY

<script type="text/javascript">
    $(document).ready(function () {
        $('#grid2 ul#loginregister a').click(function () {
        //reset all the items
        $('#grid2 ul#loginregister a').removeClass('current');
        //set current item as active
        $(this).addClass('current');
        //scroll it to the right position
        $('#grid2-2').scrollTo($(this).attr('rel'), 300);
        //disable click event
        return false;
        });
    });
</script>


<!--- G2 --->
    <div id="grid2">
        <!--- G2-1 --->
            <div id="grid2-1" class="row">
                <!--- Login --->
                    <ul id="loginregister">
                        <li class="current" id="grid2-1-1"><a href="#" rel="#grid2-2-1"><span>Already a user?</span></a></li>
                        <li id="grid2-1-2"><a href="#" rel="#grid2-2-2"><span>Register now!</span></a></li>
                    </ul>
                <!--- /Login --->
            </div>
        <!--- /G2-1 --->

        <!--- G2-2 --->
            <div id="grid2-2">
                <!--- /G2-2-1 --->
                    <div class="grid2-2-1">
                        Login form
                    </div>
                <!--- /G2-2-1 --->

                <!--- /G2-2-2 --->
                    <div class="grid2-2-2">
                        Registration form
                    </div>
                <!--- /G2-2-1 --->
            </div>
        <!--- G2-2 --->
    </div>
<!--- /G2 --->