Article

        

スクロールに連動して背景画像が切り替わる効果

2020/ 06/ 18
                 
ノートルダム

 このテンプレートで使われている効果は、スクロールに連動してフルスクリーン表示された背景画像が切り替わるといった大掛かりなものです。さらにリストナビをクリックすると、自動的にコンテンツの場所にスクロールされるようにしました。
トップ画面には複数のコンテンツが並べられていますが、スクロールに連動して現れる個々のコンテンツの高さが350pxになると、スクリプトが作動して背景画像が切り替わります。その画像の上にコンテンツの説明文が重なって見えるわけですが、これの位置調整が難しいのです。全体がレスポンシブ対応になっていますから、画面の高さがまちまちな訳で、それに合わせるのは殆ど神業です。完璧な仕上がりは不可能であり、PC等の横長な画面だとバランスが悪いです。その辺は多めに見てやってください。
 
スポンサーサイト



                         
                                  

コメント

画像の入れ方教えてください
RYUさんへ
背景画像の入れ方ですよね。これはご自身のブログ記事に添付している画像が自動的に使用される様になってます。ですから、記事を書くときにエディターを使って画像を添付してください。