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);
}
});
});
});