Colored Bootstrap Tooltip
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<a href="#" data-toggle="tooltip" data-placement="bottom"
title="" data-original-title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin interdum molestie varius. Mauris eu erat sed urna ullamcorper iaculis non ut mauris. Nulla sit amet consectetur lacus. Praesent sit amet imperdiet lacus. Suspendisse at faucibus leo. Suspendisse a ullamcorper mauris. Proin maximus nibh nunc. Mauris interdum nec lorem eu pellentesque.
Nam laoreet gravida velit, ac auctor magna ullamcorper a. Aenean id nisi sit amet lorem aliquam iaculis. Quisque nec nunc ac sapien pretium auctor accumsan ut nunc. Praesent sem nisi, molestie sit amet tincidunt gravida, consectetur quis lacus. Mauris mollis urna nec libero convallis varius. Mauris quis posuere risus. Aliquam maximus, mi et mattis ullamcorper, velit ligula ultrices sem, cursus finibus lorem quam ac nibh. Nulla facilisi. Etiam sodales id neque a iaculis. Pellentesque vitae venenatis orci, vestibulum posuere dui. Sed finibus hendrerit urna, et fringilla sapien placerat id. Aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum dictum bibendum turpis, a auctor ante facilisis quis.
Pellentesque rutrum vehicula sapien, a posuere odio vestibulum at. Vivamus tincidunt metus ante. Maecenas id sodales lectus. Curabitur mollis mattis vestibulum. Curabitur sit amet magna ante. Phasellus iaculis interdum faucibus. Curabitur sagittis dictum est. Curabitur posuere, risus ut suscipit malesuada, dui velit ultrices tellus, et semper augue ante nec metus. Vestibulum sollicitudin lorem sit amet ante hendrerit tristique. Fusce in ligula congue, condimentum tortor eget, iaculis mauris. Proin maximus, arcu id elementum pretium, turpis leo varius augue, id molestie ligula nulla nec dolor....
CSS
.red-tooltip + .tooltip > .tooltip-inner {background-color: #f00; height: 300px;}
.red-tooltip + .tooltip > .tooltip-arrow { border-bottom-color:#f00; }
.red-tooltip + .tooltip {
overflow: auto;
height: 150px;
}
JavaScript
$(document).ready(function(){
$("a").tooltip();
});