jQuery googleslides

JavaScript

Google+やPicasaから写真を埋め込みスライドショーを作れるプラグイン「jQuery googleslides」

jQuery googleslidesはGoogle+やPicasaからの写真を埋め込んでスライドショーを作ることができるjQueryプラグインです。写真を指定するにはユーザーIDとアルバムIDをオプションに設定する必要があります。Googleサービスで写真を管理している人は簡単に自分のスライドショーが作れるので便利ですね。

[ads_center]

使い方

jQuery googleslidesの使い方

このように写真を埋め込んでスライドショーを作成できます。

使い方は、まずはjQueryを読み込んでいる状態で、ダウンロードしたプラグインファイルを読み込みます。

<link href="src/jquery.googleslides.css" rel="stylesheet" type="text/css" /> 
<script src="src/jquery.googleslides.js" type="text/javascript"></script>

body内には以下のHTMLマークアップを記述しておきます。

<div id='slides'></div>

そしてスライダーを開始させます。埋め込みたい写真はユーザーIDとアルバムIDを指定します。

$('#slides').googleslides({
    userid:'ここにユーザーID',
    albumid:'ここにアルバムID'
});

オプションもimgmax、random、caption、time、fadespeedなど色々と設定することが可能なので詳しくは公式サイトでご確認下さい。ちなみにWordPressのプラグインもあるみたいですね。

Google+やPicasaから直接写真を埋め込んでスライドショーを作りたい人は是非チェックしてみて下さい。

関連記事

  1. 3D Portfolio Template

    JavaScript

    立体的に回転するテンプレート「3D Portfolio Template」

    滑らかに、立体的に回転するテンプレートを実装することができる「3D P…

  2. Naver

    JavaScript

    シンプルですごくいい!レスポンシブに合うナビゲーションのjQueryプラグイン「Naver」

    NaverというjQueryプラグインがすごくシンプルでよかったのでご…

  3. no-image

    JavaScript

    セクション間をスムーズにスクロールできる「Scroll Control」

    Scroll Controlはセクション間をスムーズにスクロールできる…

  4. Protip

    JavaScript

    カスタマイズ性抜群のツールチップを実装できる「Protip」

    Protipはカスタマイズ性が抜群のツールチップを実装することができる…

  5. Image Tilt Effect

    JavaScript

    画像にチルトエフェクトをかけることができる「Image Tilt Effect」

    Image Tilt Effectは画像にチルトエフェクトをかけたちょ…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. Kindle Oasis
  2. OWL-WDDESK01
  3. ワンタッチ着脱フィルターキット
  4. Soundcore Ace A1

アーカイブ

PAGE TOP