採用獨自開發 RWD Bo-Blog插件 對應電腦版與手機版網頁。一次上架多版本對應、顯示迅速方便。
October 9, 2011
Mouseinfobox plugin for jQuery下載相關檔案
<link rel="stylesheet" href="jquery.mouseinfobox.css" media="all" />
<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="jquery.mouseinfobox.js"></script>
<script>
$(function(){
$('.class名').infoBox({
animation: ['opacity', 'bottom'], //動畫 透過與位置
animDuration 200, //動畫速度
offsetX: 20, //x位置
offsetY: -20, //y位置
bottomPos: true, //從bottom顯示
rightPos: false //從right顯示
});
});
</script>
以及在class名上顯示的內容於title上記述。
<div class="class名" title="ツールチップテキスト">テキスト</div>
<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="jquery.mouseinfobox.js"></script>
<script>
$(function(){
$('.class名').infoBox({
animation: ['opacity', 'bottom'], //動畫 透過與位置
animDuration 200, //動畫速度
offsetX: 20, //x位置
offsetY: -20, //y位置
bottomPos: true, //從bottom顯示
rightPos: false //從right顯示
});
});
</script>
以及在class名上顯示的內容於title上記述。
<div class="class名" title="ツールチップテキスト">テキスト</div>