jQuery 顯示 facebook 粉絲團照片 V2

  • 1171
  • 0

透過 facebook Graph API 可以 取得/設定 粉絲團的資訊,本文說明引用 jQuery plugin 來呈現facebook 粉絲團的照片。

接續前文<<jQuery 顯示 facebook 粉絲團照片>>,修改原本的 jQuery 加入動態產生標籤與CSS,讓使用端更為簡單。
筆者已將 jQuery 及相關檔案上傳至 Windows Azure 網站上,可選擇以下兩種方式使用。

 

1.直接連結網頁

線上展示

http://html5jquery.azurewebsites.net/jquery-fbalbum.html?page=3510Harvest&num=12&size=196&cols=3

 

範例說明

http://html5jquery.azurewebsites.net/jquery-fbalbum.html?page=3510Harvest&num=12&size=196&cols=3

網址

http://html5jquery.azurewebsites.net/jquery-fbalbum.html

 

參數

  • page : 粉絲團的名稱
  • num : 顯示幾張照片,預設值: 12
  • size : 單張照片的大小(px),預設值: 196
  • cols : 顯示為幾欄,預設值: 3

 

以 <iframe> 置入網址呈現的結果

 

 

2. 置入 JavaScript


< script>
        $( function () {
            $.getScript("http://html5jquery.azurewebsites.net/jquery-fbalbum-1.0.0.js" )
            .done( function (script, textStatus) {
                $.fn.fbalbum_show( 'youcart' , 12, 120, 4);
            })
        })
</script >

其中第5行  $.fn.fbalbum_show( 'youcart' , 12, 120, 4); 的 4 個參數依序分別

  1. 粉絲團的名稱
  2. 顯示幾張照片
  3. 單張照片的大小(px)
  4. 顯示為幾欄