2015.01.10 Sat

【jQuery】スクロールと連動して一瞬だけテキストを表示する

前回の続きになりますが、今回はjQueryを利用して、前回よりも少しだけリッチな感じにしたものをご紹介いたします。 タイトルの通り、スクロールと連動させ、スクロールにあわせて一瞬だけテキストを表示させる方法になります。 …

2015.01.08 Thu

CSSで一瞬だけテキストを表示する方法

2015年一発目のエントリーですが、特に何事もなく普通の記事を書きます。 このサイトでも利用していますが、ページ遷移時に一瞬だけ(暗くなって)文字が表示されるやつのやり方です。HTMLとCSSだけで実装してまして、JSは…

2014.12.28 Sun

このWebサイトをリニューアルしました

このたび、THE ORTHODOX WORKSのWebサイトをリニューアルしました。 かなり適当に作った以前のサイトに比べ、今回は細部まで気合いを入れて作ってみました。ポートフォリオ色を強く意識したつもりです。 もっとも…

2014.12.10 Wed

【jQuery】プラグインを使わずに、簡単にサイドからスライドして現れるメニューを実装する(ほぼCSS)

最近はモーダルっぽい感じでメニューをページ全体に表示するパターンが増えてる気がするし、もう随分色々な方法やプラグインがあって、かなり今さらなネタですけど、クリックでサイドからスライドして現れるメニューの新たな知見を得たの…

2014.11.24 Mon

CSSのみで画像を菱形に切り抜いて表示する方法

前回の記事に引き続き、菱形についての話題。好きです菱形!! 今回は、CSSのみで画像を菱形に切り抜く方法です。そんなに難しいことではないんですが、ちょっと躓いたところがあったので、ポイントとかも含めてブログに残しておきた…

2014.11.19 Wed

CSSのみで菱形を作る方法まとめ

菱形を大量に使ったサイトを制作しているんですが、画像を使わずにCSSのみで菱形を作る方法はいくつかあって、それぞれに向き不向きみたいな特徴があるので、作り方も含めて自分用にまとめてみました。 ちなみに「菱形を大量に使った…

2014.10.27 Mon

SNSのアイコンやロゴをSVGで作った(ダウンロードあり)

ソーシャルメディアのアイコンやロゴを使用する際、Font Awesomeとかのwebフォントを利用させてもらっていたんですが、日本のSNSだったりすると用意されていなかったり、色とか柔軟に扱えなかったりしてちょっと不便を…

2014.10.16 Thu

マウスオーバーで波紋を広げる

波紋が広がりそうなタイトルですが、CSSの話で、事が起こるほうの波紋ではありません。 Dribbbleをぼーっと眺めていたら、きれいに波紋が広がるアニメーションがあって、CSSでできそうだったのでやってみました。 デモで…

2014.10.13 Mon

カラーミーショップで標準機能とは別に特定の商品をトップページに表示する

以前、カラーミーショップでPHPのfor文のような繰り返し処理という記事を書いて、これを使って何か面白いことはできないかなと考えていたんですが、使えるようで使えないようなことを考えついたので、備忘録としてメモ。 やること…