Forguncy サポート

カルーセル型セル

フォローする

セル型に「カルーセル」が使用できるようになり、自動または手動で、画像を横にスライドさせて切り替えて表示できます。
Carousel_00.png

ダウンロード

1.0.2.1(Forguncy 4以降用) Carousel_1_0_2_1.zip(521KB)
1.0.0.1(Forguncy 3用) FGC3_Carousel_1_0_0_1.zip (700 KB)

 

インストール

ダウンロードしたプラグインを「プラグインを追加する」を参照してインストールすると、以下が「プラグインの管理」に表示されます。インストール後にForguncyの再起動が必要なことに注意してください。

Carousel_1_0_2_1.png

 使い方

  1. 任意のセルの領域にカルーセル型セルを割り当てます。
    画像を表示する領域を選択して、[ホーム]→[セル型]のドロップダウンリストから[カルーセル]を選択します。Carousel_01.png
  2. カルーセル型セルの詳細を設定します。
    右ペイン下部の[セル型]タブをクリックして、カルーセル型セルの設定を行います。Carousel_02.png
テーブルからデータを取得

チェックされている場合、データベースから画像データを取得します。「カルーセル項目…」をクリックして連結するフィールドを指定してください。
チェックしていない場合、「カルーセル項目…」をクリックすることで、任意の画像を指定できます。

カルーセル項目…

切り替える画像を指定します。

「テーブルからデータを取得」がチェックされている時は、次の画面が表示されます。連結するテーブルを指定し、タイトル、説明、画像に連結したいフィールドを指定します。画像は画像型の必要があります。
Carousel_03.png

  • テーブル
    連結するテーブルを選択します。
  • タイトル
    画像のタイトルとして表示するフィールドを指定します。
  • 説明
    画像の説明として表示するフィールドを指定します。
  • 画像
    表示する画像のフィールドを指定します。
  • クエリー条件…
    絞り込みの条件を設定します。(※1.0.2.1以降)

バージョン1.0.2.1では、「クエリー条件…」をクリックすると、次の画面が表示されて絞り込み条件を設定できます。

Carousel_04.png

 

「テーブルからデータを取得」がチェックされていない時は、次の画面が表示されます。Carousel_05.png

  • 画面左のリスト
    各画像を表します。追加したい場合は「+」削除したい場合は「−」をクリックします。
  • コマンド…
    画像をクリックした時に実行されるコマンドを設定します。詳細は、セル型のコマンドを参照してください。
  • タイトル
    画像のタイトルを入力できます。
  • 説明
    画像の説明を入力できます。
  • 画像の選択…
    任意の画像ファイルを選択します。  
左右のスライドボタンの表示 チェックされている時、画像の左右に画像をスライドするボタン(FGC3_Carousel6.png FGC3_Carousel7.png)を表示します。
ボタンをクリックすると、前または次の画像に切り替わります。
ナビゲーションの表示 チェックされている時、画像の下部にナビゲーション(○○○)を表示します。
ナビゲーションボタンをクリックすると、そのボタンに対する画像に切り替わります。
ナビゲーションボタンのデフォルトの色は白です。変更するには、以下のように文字の色として設定してください。
FGC3_Carousel8.png
タイトルと説明の表示 チェックされている時、画像のタイトルと説明を表示します。
ループ表示 チェックされている時、最後の画像を表示した後、また最初の画像を表示してループします。
チェックされていない時、最後の画像を表示した後、画面の切替が止まります。
自動表示切替 チェックされている時、画像が自動的に切り替わります。
表示切替間隔(秒) 「自動表示切替」がチェックされている時、画像が切り替わる間隔を秒で指定します。
マウスホバーで表示切替しない 「自動表示切替」がチェックされている時、「マウスホバーで表示切替しない」にチェックをすると、画像上にマウスカーソルを置くことで、画像の自動切り替えを停止します。

3.アプリケーションを実行して動作を確認してみましょう

制限事項と注意点

  • テーブル内の画像フィールドのデータ型は「画像」の必要があります。
  • 「テーブルからデータを取得」がチェックされていてデータベースから画像データを取得する場合、画像に合わせてコマンドを実行できません。コマンドの実行は、「テーブルからデータを取得」がチェックされていない時にのみ可能です。

セル型を設定できる箇所

通常のページ
マスターページ
モバイルページ
モバイルマスターページ
リストビュー ×
モバイルリストビュー ×

使用できるForguncyのバージョン

プラグインのバージョン 使用できるForguncyのバージョン
1.0.2.1(Forguncy 4以降用) 4.0.104.0以降
1.0.0.1(Forguncy 3用) 3.0.105.0以降(Forguncy 3のみ)

更新履歴

  • 1.0.2.1(2019/1/25 リリース)
    Forguncy 4以降用 公開。
    テーブルからデータを取得する際、クエリー条件の設定が追加されました。

  • 1.0.0.1(2018/4/3 リリース)
    Forguncy 3用 初版公開

 

 

この記事は役に立ちましたか?
0人中0人がこの記事が役に立ったと言っています
他にご質問がございましたら、リクエストを送信してください

コメント