直線上に配置
メニューを開く

資料小分類

  • 最新テクニック活用
  • 動きのある写真演出
  • サイト/ページの準備
  • ロゴの編集
  • ボタンの編集
  • ページの整備
  • フォトモーション
  • カルーセル
  • ズーム
  • ギャラリー
  • スライドショー

資料大分類

  • 資料トップへ戻る
  • 基礎編
  • HPを作成してみる
  • 白紙からページ作成
  • トップページを作成
  • サブページを作成
  • サイト管理
  • HTML/CSSを知る
  • Web ページ
  • HTML 練習
  • CSS 練習
  • レイアウト作成
  • レイアウト編集
  • 最新テクニック活用
  • フォトモーション
  • フルCSSテンプ基本
  • フルCSSテンプ応用
  • jQueryの基本
  • Jimdo で作成

リンク

  • サイト内検索
  • 問い合わせ
  • 参加者作品
  • HP勉強会トップ
  • A班ホームページ

動きのある写真の演出

複数の写真を、スライドショーやズームといった動きのある演出 フォトモ-ション で見せることができます。動きを決めたら、写真を選択してスタイルを設定するだけの簡単な操作で、魅力ある写真演出を作成できます。

設定できる動き(モーション)には:

  • カルーセル
    • 写真を循環させて、流し見することができます。
      • カルーセル
      • 複数の画像を横一列に並べてスクロールして表示する。
  • ズーム
    • サムネイルでポインターを合わせた部分を拡大表示できます。
      • ズーム
      • 画像の精密な部分を拡大表示する。
  • ギャラリー
    • サムネイルをクリックして、写真を画面いっぱいに表示できます。
      • ギャラリー
      • サムネイル画像をタイル状に並べる。クリックして大きく表示する。
  • スライドショー
    • 写真をいろいろな効果で切り替えながら表示します。
      • スライドショー
      • 複数の画像を自動的に切り替える。切り替え効果には、スライドをはじめ、フェードイン、モザイク、パラパラめくりなど24種類。

フォトモーションは全デバイス対応を目指して開発された jQuery によるコンテンツです。

ヒントjQuery
jQuery は、ウェブブラウザ用の JavaScript コードをより容易に記述できるようにするために設計された軽量な JavaScript ライブラリです。

まず ページの準備 へ進みます。

直線上に配置

| |