lik post issue

by karimkhan

HTML

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.min.css">
            <div class="home-content">
                <div class="menu-bar">
                        <ul class="nav nav-tabs">
                          <li class="active" id="top_picks"><a href="#">Top Picks<sup>beta</sup></a></li>
                          <li><a href="#" id="popular">Popular<sup>beta</sup></a></li>
                          <li><a href="#" id="analysis">Friends analysis</a></li>
                        </ul>
                        <p class="custom-alert">Article changes everyday! come back for more fun......</p>
                </div>
            </div>
<div class="articleContent">This content changes when link is clicked</div>

CSS

/* Drop down css begin */



	.dropdown-menu{

	    width:460px !important ; 

	    left: 9.6% !important;

	    margin:0 auto !important;

	}

	.twitter-typeahead .tt-query, .twitter-typeahead .tt-hint {

	    margin-bottom: 0;

	    width: 460px; !important;

	}

	.twitter-typeahead .tt-hint {

	    display: block !important;

	    height: 34px !important;

	    padding: 6px 12px !important;

	    font-size: 14px !important;

	    line-height: 1.428571429;

	    border: 1px solid transparent;

	    border-radius:4px;

	}

	.twitter-typeahead .hint-small {

	    height: 30px !important;

	    padding: 5px 10px !important;

	    font-size: 12px !important;

	    border-radius: 3px;

	    line-height: 1.5;

	}

	.twitter-typeahead .hint-large {

	    height: 45px !important;

	    padding: 10px 16px;

	    font-size: 18px;

	    border-radius: 6px;

	    line-height: 1.33;

	}

	.tt-dropdown-menu {	    min-width: 460px !important;

	    margin-top: 2px;

	    padding: 5px 0;

	    background-color: #fff;

	    border: 1px solid #ccc;

	    border: 1px solid rgba(0, 0, 0, .2);

	    *border-right-width: 2px;

	    *border-bottom-width: 2px;

	    -webkit-border-radius: 6px;

	    -moz-border-radius: 6px;

	    border-radius: 6px;

	    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);

	    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);

	    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);

	    -webkit-background-clip: padding-box;

	    -moz-background-clip: padding;

	    background-clip: padding-box;

	}

	.tt-suggestion {

	    display: block;

	    padding: 3px 20px;

	}

	.tt-suggestion.tt-is-under-cursor {

	    color: #fff;

	    background-color: #0081c2;

	    background-image: -moz-linear-gradient(top, #0088cc, #0077b3);

	    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));

	    background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);

	    background-image: -o-linear-gradient(top, #0088cc, #0077b3);

	   ...

JavaScript

$(function () {
			$(".menu-bar li a").click(function () {
				var category = $(this).attr('id');
				$(".active").removeClass("active");
				$(this).parent().addClass("active");
				
				//$('label').css('color', selText);
                // When user clicks o "top picks" then it does not post category to ivite_db.php
				    $.ajax({
				            url: "invite_db.php",
				            type: "POST",
				            data: {"link_menu": category},
				            success: function(data) {
				                $(".articleContent").html(data);
				            }
				        });           
                });
            });