2015年8月24日 星期一

mouse over hint, message


css
/*    */
/* Jas's CSS ToolTip */
a.jastips{
z-index:9;
color:#690;
border-bottom:1px dotted #690;
text-decoration:none;
}
a.jastips:hover{
position:relative;
z-index:99;
cursor:help;
}
a.jastips span{
display:none;
}

a.jastips:hover span{
display:block;
position:absolute;
float:left;
white-space:nowrap;
top:-2.25em;
left:0;
background:#666;
border:1px solid #000;
color:#fff;
padding:1px 5px;
margin:0;
z-index:9;
}
/* end of Jas's CSS ToolTip */


<a href="#services" class="jastips clickscroll">
<div class="col-xs-3">
<!-- <i class="icon-resize-full-outline iconBig"></i>-->
<img class="img-responsive" src="images/index_page/BU03.jpg">
</div>
<div class="col-xs-9">
<h2>Interior Designer</h2>
<p>Display your client's dream decoration directly in their home using augmented reality. Make the experience more interactive than ever, and boost your sales.</p>

</div>
<span>Not available yet</span>
</a>

沒有留言:

張貼留言