ブックマーク / webkikaku.co.jp (2)

  • フッターをCSSやjQueryで常に最下部(一番下)に固定表示する方法 | 株式会社WEB企画

    ウェブサイトを制作中に、「あれ?コンテンツが少なくてフッターが浮き上がってきてる!?」なんて経験はありませんか? 弊社は東京と名古屋でホームページ制作を行っている会社ですので、稀にですがそういったシーンがあります。 「そうじゃなくて最下部にフッターを固定表示したいんだーっ!」というあなたのためのエントリーです。 ↓弊社リンク 「株式会社WEB企画」のホームページはこちら CSSで実装する flexbox(CSS3)を使う この記事を公開した際には、存在していなかったのですが、最近では flexbox のお陰でかなり実装が楽になっています。(2019/06/11現在) 下記の内容をコピペで実装できます。HTML5の書き方をしていることが条件になりますね。 【HTML】 <body> <div id="wrapper"> <main> <!-- メインコンテンツ --> </main> <fo

    フッターをCSSやjQueryで常に最下部(一番下)に固定表示する方法 | 株式会社WEB企画
    webstrategist
    webstrategist 2015/10/16
    “<div id="container"><div id="header">ヘッダー</div><div id="contents">コンテンツ</div><div id="footer">フッター</div>”
  • css3アニメーションのレパートリーがきっと増える!動きの参考になる22サイト | 株式会社WEB企画

    css3でアニメーションを使用するサイトが近頃増えてきました。背景としては、css3アニメーションのプロパティにほぼ対応しているスマホ端末の普及や、animationプロパティ未対応のIE9(IE6~IE8を含む)のシェアが低下してきていることが挙げられると思います。 つまり、css3アニメーションの対応ブラウザは「増加中」ということに他ならず、実装するサイトは更に増えていくのではないでしょうか。 今回は、そんなcss3アニメーションの実装時に参考できる22サイトを集めてみました! 1:丸型オブジェクトにピッタリのアニメーションギャラリー 丸型オブジェクトに対して、様々なホバーエフェクトを実装しています。 何気なくマウスオーバーした時にこんな動きがあれば、注意を引きつけられそうですね! http://tympanus.net/codrops/2013/05/30/simple-icon-h

    css3アニメーションのレパートリーがきっと増える!動きの参考になる22サイト | 株式会社WEB企画
  • 1