ページ切り替えが楽しくなる！ワンページで紙芝居風ページをスライドして切り替える『Page Transitions with CSS3』
Page Transitions with CSS3 ページを切り替えるときに効果を与える方法はいろいろありますが、ほとんどはjQueryなどのJavaScriptを使用したものがたくさん溢れているような気がします。 しかし今回はCSSのみを使用して、ひとつのページでコンテンツをスライドさせて切り替える『Page Transitions with CSS3』を紹介します。 <div>～</div>で囲んだdiv要素ごとにページを作成し、コンテンツをスライドさせてページを切り替えるワンページャーのウェブサイトを作ることができます。 とういうことで、サンプルページを作ってみました。こんな感じになります。 → 『Page Transitions with CSS3』サンプルページ jQueryを使用していないので、jQueryなどをダウンロードする必要はありませんが、『Page Transiti
クリックするとメニューが上から現れる『Top Drawer – A smooth dropdown menu for responsive web design』
今回は、クリックすると上から降りてくるドロップダウンメニューのソースを紹介します。 サンプルをみてもらうとわかりやすいと思います。 →「クリックするとメニューが上から現れる『Top Drawer – A smooth dropdown menu for responsive web design』サンプル」 レスポンシブ対応のドロップダウンメニューですので、スマホなどでも綺麗に表示されます。jQueryプラグインは使用していません。 【設置方法】 まずはcssファイルを作成します。ソースは以下の通りです。 CSS .top { background: #212121; color: #fff; position: absolute; left: 0; top: 0; right: 0; z-index: 2; overflow: hidden; } .drawer { -webkit-tr
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
