jSlideto 高亮範圍畫面

如果在同一個網頁上面有太多太多的內容，可能上面會有標題再來用書籤方式做當前頁面的連結，jSlideto 這一個套件可以讓書籤的功能有趣一點，以滑動動畫的方式移到書籤的目標段落，然後再把該段落以開發者配置的顏色做成高亮提示，讓使用者可以清楚的知道該標題的文章範圍。

使用方法：

第一步 載入程式所需要的檔案
//使用 Google AJAX API 取得 jQuery 1.8.2 版本
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
//使用 Google AJAX API 取得 jQuery UI 1.9.0 版本
//如需要高亮效果才須加載此一檔案
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/jquery-ui.min.js"></script>
//jSlideto 的主程式碼
<script src="js/jquery.slideto.min.js" type="text/javascript"></script>

第二步 為你需要高亮的文章內容命名一個 ID
書籤的地方也需要一個ID，可以以按鈕或者是連結方式呈現
<button id="GO">到我要的地方</button>
很多很多的其他內容
          .
          .
          .
<div id="MyTitle">很多很多的內容...</div>

第三步 加上 JavaScript 啟動程式執行
$(function(){
  $("#GO").click(function(){
$("#MyTitle").slideto({
      highlight_color: 'blue',
      highlight_duration: 500,
      slide_duration: "fast"
    });
  });
});

附上程式可修改的參數值

參數	預設	說明
highlight	true	是否要高亮文字內容
highlight_duration	3000	高亮後回覆的時間.以毫秒為單位
highlight_color	FFFF99	高亮的顏色
slide_duration	slow	移動到書籤位置的速度 slow,normal,fast 或以數字毫秒為單位

作者網站：http://djpate.com/2011/01/01/animated-scrollto-effect-jquery-plugin/
檔案大小：9.41 KB(包含範例)
檔案下載：http://github.com/djpate/jSlideto/zipball/master
檔案備份：下載