Museを使ったレスポンシブWebサイト制作

スクロール効果について

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
画面のスクロールに合わせてオブジェクトの位置が変化するスクロール効果が、レスポンシブ時は無効となる旨について解説します。
講師:
02:39

字幕

このレッスンではスクロール効果とレスポンシブデザインの関係について解説します。それでは、このレッスンのサンプルプロジェクト今開かれてますね。ではホームページを開いてそしたら、ちょっと1個効果を設定してみます。今この様になってますがこちらのツールの中から「スクロール効果」という所ですね。もし、ない場合には「ウィンドウ」のメニューから「スクロール効果」これを出して下さい。これをオブジェクトに適用すると画面のスクロールに合わせて動く効果を作ることができます。ではこの中の1個のオブジェクトこれに適用してみましょう。オブジェクトを選ぶと有効になるので「モーション」、これをオンにします。ではちょっとプレビューして見てみましょう。プレビューしてみると今適用しただけですけどこの様にスクロールに合わせて画像が動いてくるとこの様な効果ができました。これがスクロール効果です。非常にサイトに動きを出すのに便利な効果なんですがこれが実は制限があります。では今、このページ右クリックして「ページプロパティ」見てみると今「固定幅」になってます。ではこれを「可変幅」レスポンシブにしようとするとこんな表示が出てきます。「このブレークポイントにはスクロール効果が含まれており、ブレークポイントを可変幅にすると、この効果は無効になります。」とこんな確認が出てきます。 つまりレスポンシブの時にはあのスクロール効果は使えないんですね。これ「はい」にしてしまうとページはレスポンシブになるんですが効果はなくなります。同時にこちらの機能も動かなくなります。なのでスクロール効果を使いたい時には元々厳密にこの位置に来ると設定するものなのでレスポンシブをとるかスクロールをとるかどちらかの択一となります。そこらへん、スクロール効果を使おうと思ったのにレスポンシブにしてしまったので使えないと、またその逆とかですね。そういった問題が起こらないようにこの関係性、覚えておいて下さい。

Museを使ったレスポンシブWebサイト制作

Museを使うと、パソコンだけでなくスマートフォンやタブレットなどのモバイルデバイスで快適に閲覧できるレスポンシブWebサイトを簡単に作成することができます。このコースではレスポンシブWebデザインの基礎知識やMuseを使ったメニューのカスタマイズ、オブジェクトのスケーリングや画面の幅に応じた再配置、デザインの調整に付随する問題の解決方法などを学びます。

1時間04分 (13 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 1,990
発売日:2016年08月07日
再生時間:1時間04分 (13 ビデオ)

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。