jQueryの連続アニメーション、例えば 上に30px動いたあと、下に30px動いてもとに戻る。 といった表現はメソッドチェーンを使うことで実現できるようだ。 (function arrow_animation() { $(".first .footer .arrow") .animate({ marginTop : 5 }, 600) .anima…

css3で使えるtransitionによるアニメーション効果。非常にリッチな動きを表現することができるが、残念なことにIE9以下では動かすことができない。 従って、広い層に見てもらうためにはあまり実用的でない。そうした古いブラウザでも対応してもらうためにはj…

CSS3は本当に多彩なアニメーションができる。 まさかCSS3を使ってrotateやらtransitionをこねくり回して幾何学的な頭の使い方をする日が来るとは思ってなかった。 しかし、ここまで自由度が高いとは。凝ればかなり面白いことができそう。 ・細かいアニメーシ…

main.scss に全てのコードを集中させず、複数ファイルに分割する。(これはcssに限った話ではないかも) main.scssは各ファイルをimportする役割 ・main.scss - header.scss - wrapper.scss - footer.scss など。 id、 !important、 position:absolute はよほ…

昨日に引き続き、今日はスマホサイト制作を初めて経験した。 その基本のキとも呼べる部分が Viewport なる概念だろう。 これもなかなかツワモノで、その概念をつかむのに多少時間がかかった。 こちらのサイトがわかりやすい。 スマホコーディング初心者のた…

初めて本格的にIE対応をしなければならない機会があり、IE6まで対応すべく激闘しておりました。 IE6に至ってはpngの透過画像を透過してくれないなど、予想以上に悲惨な状況であり、多くのエンジニアがIE糞と言っている理由がよくわかりました。 IE6対策PNG透…

potision: relativeって使いどころがなかなかわからないですよね。そんな中で、これを使う機会に出会ったので紹介します。 例えば、marginの横幅をautoにする場合って、親要素のdivに対してautoが適用されます。親要素がない場合は、bodyタグのwidthを基準と…

どうも。面白法人カヤックの田島です。 技術ブログと通常のブログの記事がごちゃまぜになったブログはかっこ悪いので、別々に分けることにしました。 技術ブログ・通常ブログともに毎日更新していきます。 さて、現在はマークアップ言語における便利なライブ…