PowerTip Demo

A few examples of the jQuery PowerTip plugin in action.

by sinhviencntt

HTML

<script src="https://stevenbenner.github.io/jquery-powertip/scripts/jquery.powertip.js"></script>
<link rel="stylesheet" href="https://stevenbenner.github.io/jquery-powertip/styles/jquery.powertip.css">
<div id='main'>
    <label class="nopowerTip" title="<b>SinhVienCNTT.Net<b>">Học JQUERY</label></br></br></br>
    <label class="se_powerTip" title="<b>SinhVienCNTT.Net<b> ">Học JQUERY</label></br></br></br>
    <label class="e_powerTip" title="SinhVienCNTT.Net">Học JQUERY</label></br></br></br>
    <label class="se-alt_powerTip" title="<label class='textYellow'><b>SinhVienCNTT.Net</b><label>">Học JQUERY</label></br>
    </div>

CSS

#main {
  width: 100px;
  margin: 50px auto;
}

#powerTip {
  background-color: red;
}
        
.textYellow {
  color: yellow;
}

JavaScript

$('.e_powerTip').powerTip({ 
	placement: 'e',
	mouseOnToPopup: true
});
            
$('.se_powerTip').powerTip({ 
	placement: 'se' 
});
            
$('.se-alt_powerTip').powerTip({ 
	placement: 'se-alt' 
});