讓文章的關鍵字或標籤高亮顯示 - 基於jQuery 框架
Text Highlight 實際觸發時畫面 |
使用方法:
首先載入必須要使用到的檔案
//使用Google ajax API 直接連結 jQuery 1.7.2的min版本
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
//Text Highlight 程式的壓縮版本 大小僅 1 KB
<script src="jquery.highlight-4.closure.js" type="text/javascript"></script>
然後設計要高亮顯示文字片段的CSS語法
<style> /* 範例設定為黃色背景 */
.highlight{background-color:yellow}
</style>
HTML部分設定要取代為高亮的區塊例如
<div id="Myhighlight">
文字內容
<div>很多很多內容</div>
</div>
最後再寫 JavaScript 的動作就完成了
JavaScript 可以執行兩種動作
一個是寫入高亮
$('#Myhighlight').highlight('內容');
另一個是移除高亮
$('#Myhighlight').removeHighlight();
執行的時機點就由設計師們自行決定了
作者網站:http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
檔案大小:1 KB
檔案下載:http://johannburkard.de/resources/Johann/jquery.highlight-4.closure.js
檔案備份:下載
0 意見