タグ

ブックマーク / www.nxworld.net (4)

  • WordPress:カスタマイズするなら覚えておきたい条件分岐について - NxWorld

    WordPressを使ってサイトやブログを構築する際、例えば「一覧と詳細でサイドコンテンツを変えたい」とか「カテゴリーによって表示内容をガラッと変えたい」のように「○○の時に○○する」といったことをしたい場合に用いるのが条件分岐です。 WordPressには便利な条件分岐タグが沢山用意されており、それらを用いることで様々なことができるので、先述したように特定の条件で何か処理を行うカスタマイズをしたい方は参考にしてみてください。 条件分岐の使い方 条件分岐とは、簡単に説明すると「指定された条件に合うか・合わないかを判断し、判断に応じて処理を行う」というものになり、例えばWordPressの場合であればこれを利用することによって、同じテンプレートを使用していても条件に応じて全く違う見栄えにしたり、処理を行うといったことが可能です。 条件分岐にはswitch文というものもありますが、ここで紹介し

    WordPress:カスタマイズするなら覚えておきたい条件分岐について - NxWorld
  • jQuery:スクロールしたらヘッダーやナビゲーションを固定・変化させる動きを実装するサンプルコード 5 - NxWorld

    一度は見かけたことがあると思う、スクロールしたらヘッダーやナビゲーションを固定表示させたり見栄えを変化させたりする動きをjQueryで実装するサンプルです。 途中から要素を固定させたり、スクロールした方向によって表示・非表示を切り替えたりなど全5種類です。 使用HTML 特にこのようにしなければいけないというものではないですが、今回のサンプルで使用しているHTMLはいずれも下記のようなもの(サンプルによってはnav要素がないものもあります)になっており、このHTMLにあるheaderやnav要素に対してjQueryで処理していくといった感じになります。 <header> ...</header> <nav> ... </nav> <main> ... </main> <footer> ... </footer>

    jQuery:スクロールしたらヘッダーやナビゲーションを固定・変化させる動きを実装するサンプルコード 5 - NxWorld
  • Flexboxを利用してよくあるレイアウトを実装したサンプル集 - NxWorld

    一部ブラウザ(特にIE)で若干挙動が違ったりすることもあるものの、Flexboxを利用することで今までCSSだけでは難しかった見栄えが実装できたり、よりシンプルなHTMLCSSで実装できるレイアウトが増えました。 そんなFlexboxを利用してサイト制作時によく出てくるレイアウトを実装したサンプルをいくつか紹介します。 紹介するものは基的にプレフィックスを省略しているので、必要があれば各自で追記してください。 基的に各実装に必要なFlexbox関連の最小限のコードのみ紹介していますが、サンプルによってはわざわざ初期値(flex-wrapやalign-itemsなど)を指定している場合があります。 それらは挙動を把握しやすくするために記述されているものなので、不要であれば記述する必要はありません。 表示確認のデモはPCでの閲覧推奨です。 要素を両端に寄せる 特にヘッダーやフッターで利用

    Flexboxを利用してよくあるレイアウトを実装したサンプル集 - NxWorld
  • NxWorld

    My weblog space for web development and design.

    NxWorld
  • 1