Template-11-05-2015

Template-11-05-2015

by santosh_patnala

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<nav class="navbar navbar-default navbar-static-top topNav" role="navigation">
    <div class="container">
        <div class="navbar-collapse topNavCollapse">
            <ul class="nav navbar-nav">
                <li><span class="contactNumber"><span class="glyphicon glyphicon-phone-alt" aria-hidden="true"></span>&nbsp;&nbsp;<b>1234567890&nbsp;/&nbsp;0987654321</b>
                    </span>
                </li>
            </ul>
            <ul class="nav navbar-nav navbar-right socialIcons">
                <li class="connectWith"><a href="#" class="fbook"></a>
                </li>
                <li class="connectWith"><a href="#" class="twitter"></a>
                </li>
                <li class="connectWith"><a href="#" class="skype"></a>
                </li>
                <li class="txtSearchBar">
                    <div class="col-lg-12" style="margin:5px 0 0 10px;">
                        <!--10px 30px 0 0-->
                        <input type="text" class="form-control txtSearch" placeholder="Search" />
                        <!----> <span class="glyphicon glyphicon-search searchIcon" aria-hidden="true"></span>

                    </div>
                </li>
            </ul>
        </div>
    </div>
</nav>
<nav class="navbar navbar-default navbar-static-top bigNavBar" role="navigation">
    <div class="container">
        <div class="navbar-header col-lg-12">
            <button type="button" class="navbar-toggle" data-toggle="modal" data-target="#navModal">
                <!--collapse / modal #navbar / #navModal--> <span class="sr-only">Toggle navigation</span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>

            </button> <a class="navbar-brand" href="index.html">Project name</a>
 <span...

CSS

/*COMMON SETTINGS START*/
 html {
    position: relative;
    min-height: 100%;
}
body {
    /*font-family:Source Sans Pro;*/
    /*height: 800px; margin-bottom: 60px; Margin bottom by footer height */
}
.footer {
    /* position: absolute;     bottom: 0;     width: 100%;Set the fixed height of the footer here */
    /*height: 60px;*/
    background-color: #555555;
}
p {
    line-height: 24px;
}
ul {
    list-style: none;
}
*:focus {
    outline: none !important;
}
a, a:hover {
    text-decoration: none;
}
/*COMMON SETTINGS END*/

/*HEADER START*/
 .bigNavBar .navbar-header {
    text-align: center;
}
.navbar-brand {
    color: #c13c3c !important;
    font-size: 38px;
    float: none;
    letter-spacing: 2px;
    margin-top: 22px;
    display: block;
}
.logo-slogan {
    /*color: #999;*/
    border-bottom: 1px solid #c13c3c;
    color: #000;
    font-size: 13px;
    font-style: italic;
    letter-spacing: 4px;
    padding-bottom: 4px;
    word-spacing: 8px;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: transparent;
    color: #333;
    border-bottom: 1px solid #c13c3c;
}
.caret {
    color: #c13c3c;
}
.dropdown-menu {
    background-color: #e7e7e7;
    box-shadow: 2px 3px 5px -1px rgba(0, 0, 0, 0.176);
    border-top: 0;
}
.navbar-default .navbar-toggle {
    margin-top: 30px;
    border-color: transparent;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: transparent;
}
/*HEADER END*/

/*NAV LOGIN / REGISTER START*/
 .btn {
    border-radius: 0;
}
.form-control {
    background-color: #FEFEFE;
    border-radius: 0;
    box-shadow: none;
}
.form-control:focus {
    background-color: #FFF;
    box-shadow: none;
}
.loginDropDownMenu {
    width: 250px;
}
.registerDropDownMenu {
    width: 500px;
}
.form-control.dob {
    display: inline;
    width: 15%;
}
.emailSend {
    display: block;
   ...

JavaScript

//var lic = angular.module("LICApp", ['ngRoute']);
//lic.controller("LICController", ['$scope', function ($scope) { } ]);


$(function () {
    //    $("#header").load("header.html");
    $("#footer").load("footer.html");
    $("#modalLogin").on("click", function () {
        $("#navModal").removeClass("fade").modal("hide");
        $("#signinModal").addClass("fade").modal("show");
    });
    $("#modalRegister").on("click", function () {
        $("#navModal").removeClass("fade").modal("hide");
        $("#registerModal").addClass("fade").modal("show");
    });
    $("#modalForget").on("click", function () {
        $("#signinModal").removeClass("fade").modal("hide");
        $("#forgetModal").addClass("fade").modal("show");
    });

    $('.dropdown-menu').find('form').on('click', function (e) {
        e.stopPropagation();
        if ($(e.target).is('[data-toggle=modal]')) {
            $($(e.target).data('target')).modal();
        }
    });
    if ($(window).width() > 767) {
        $("#navModal").modal('hide');
        $("#forgetModal .modal-dialog").addClass("width25percent");
    } else {
        var ht = $(window).height() - 50;
        $("#navModal .modal-dialog").css({
            "height": ht,
                "overflow-y": "scroll"
        });
        $("#signinModal .modal-dialog").css({
            "height": ht,
                "overflow-y": "scroll"
        });
        $("#forgetModal .modal-dialog").css({
            "height": ht,
                "overflow-y": "scroll"
        });
        $("#registerModal .modal-dialog").css({
            "height": ht,
                "overflow-y": "scroll"
        });
        $("#forgetModal .modal-dialog").removeClass("width25percent");
        $(".registerDropDownMenu").css("width", "100%");
    }
    //USED TO CLEAR THE MODAL FORM ELEMENTS START
    $.clearInput = function () {
        $('form').find('input[type=text], input[type=password], input[type=number], input[type=email], textarea').val('');
       ...