タグ

2011年12月19日のブックマーク (1件)

  • コンテンツ上に広がるバナーの作り方

    HTMLコンテンツ上に広がるバナーを作成しよう! 今回はマウスのアクションでHTMLコンテンツ上に広がるバナーを作成してみたいと思います。「HTMLコンテンツ上に広がる」というのは、ページ表示の最初はバナー枠に収まるように表示されていますが、何らかのイベントで「HTMLコンテンツ上にレイヤーとして重なる(広がる)」という意味です。 最初に、どのようなデザインにするかを決めましょう。 前回までに作ってきた「FLA-ALE」という架空のビールメーカーのロゴを使用し、これを大きく表示するバナーを作ってみます。動作は「初期状態は大きなロゴの一部がスーパーバナー領域に見えており、そこをクリックするとバナーエリアがHTMLコンテンツ上に広がり、ロゴのすべてが見える」というものです(図1)。 次にHTMLとしてどのような処理を行えばいいかを考えます。 もともと表示させているスーパーバナー領域のdiv要素