Category : Tips

- 173 Articles -

スマートフォンサイト制作時に覚えておきたいCSS 15

Read Article

スマートフォンサイト制作時に覚えておきたいCSS 15

スマートフォンサイトを制作する際、個人的に覚えておいた方が良いと思うCSSのプロパティやテクニックをまとめてみました。自分用の備忘録ではありますが、他のブログ等でも取り上げられていることが多いので、いずれも覚えておいて損はないものだと思います。普段から制作している方にとっては目新しいのはないと思いますが、まだスマートフォンサイトを制作したことがない方やまだまだ苦手だなと思う方は参考にしてみてくださ…

  • Tips
レスポンシブやスワイプ機能を実装できる、スライダー・カルーセルのプラグインやチュートリアル 20

Read Article

レスポンシブやスワイプ機能を実装できる、スライダー・カルーセルのプラグインやチュートリアル 20

スマートフォンやタブレットが絡むサイト制作時に実装することが多い、レスポンシブ対応やスワイプ(フリック)などといった機能を簡単に実装できるスライダー・カルーセルのプラグインやチュートリアルのまとめです。いずれかひとつの機能のみ実装するだけでなく、中にはひとつのプラグインで複数の機能を同時に実装できるのもあります。

  • Tips
パララックス効果を実装できるプラグインやチュートリアル 30

Read Article

パララックス効果を実装できるプラグインやチュートリアル 30

あくまでも予想で尚且つ海外の情報というのはあるんですが、海外ブログなどでは去年に引き続き今年もパララックスは流行ると予想しているところが多く、個人的にもパララックスは残りそうなトレンドのひとつだと思ったので整理兼ねてまとめました。全体的に目新しいものではないですが、いずれも簡単にパララックス効果を実装できる便利プラグインやパララックスの実装方法などがわかりやすく解説しているチュートリアルなどです。

  • Tips
jQuery:電話番号リンクの有効・無効をUAで切り替える方法

Read Article

jQuery:電話番号リンクの有効・無効をUAで切り替える方法

備忘録。スマートフォン専用で制作されたものはそのままで問題ないと思いますが、レスポンシブで制作した場合などにPC上では電話番号リンクは無効にしたいということがあります。そこでjQueryとユーザーエージェントを用いて、スマートフォンからアクセスされている時のみ電話番号のリンクを有効化するようにします。

  • Tips
フォーム周りで活躍してくれるjQueryプラグイン 50

Read Article

フォーム周りで活躍してくれるjQueryプラグイン 50

少し古いのもありますが、今年見かけたものを中心にフォーム周りでいつか使う機会がありそうだと思ったjQueryプラグインのまとめです。バリデーションや各フォームエレメントのデザイン変更といったオーソドックスなものから、上手く使えばユーザビリティの向上に繋がりそうなもの、面白い動きを実装できるものまで様々なタイプがあります。中にはCSS3を併用したり、そのままでは日本語に対応していないというものも幾つ…

  • Tips
CSSのみで実装するボタンデザインやホバーエフェクト 20+α

Read Article

CSSのみで実装するボタンデザインやホバーエフェクト 20+α

実際に使用したものやいつか使うかもと思ったものをJSFiddleやEvernoteなんかでバラバラにメモしていたのですが、それらの中でよく使いそうなものを一覧化したものが欲しかったのでまとめました。>今となっては様々なところで用いられていますし、もっと凄くて面白い動きを実装しているチュートリアルなんかも沢山見かけますが、個人的に汎用性高いと思うもの中心です。>対象ブラウザに古いIEなどが含まれてい…

  • Tips
YouTube埋め込み時に便利なパラメータ 10+

Read Article

YouTube埋め込み時に便利なパラメータ 10+

サイトにYouTube動画を表示したいと思ったとき、イベントを絡めるといったようなカスタマイズをしてとかになるとAPIを使用したりになると思いますが、とりあえず表示するだけであればiframeで簡単に埋め込むことができます。そんなときに知っておくと便利なパラメータ10種類を自分が使用頻度が高いと思う組み合わせ3つと併せて紹介します。

  • Tips
グリッドレイアウト採用時に便利なjQueryプラグイン 20

Read Article

グリッドレイアウト採用時に便利なjQueryプラグイン 20

有名なサイトだとPinterestやBehanceなどで取り入れているような、グリッドレイアウトを簡単に実装できるjQueryプラグインのまとめです。少し前はポートフォリオのギャラリー部分などのような箇所で主に使われている印象が個人的にあったのですが、最近ではブログの記事一覧やECサイトなどでもよく見かけますし、コーポレートサイトのトップに採用しているサイトなども多く見かけます。基本的な動きは同じ…

  • Tips
画像にビフォーアフターを実装できるjQueryプラグイン

Read Article

画像にビフォーアフターを実装できるjQueryプラグイン

使う機会がありそうなので調べたら、幾つか良さそうなものがあったので備忘録兼ねて紹介します。商品の使用前後・家などのリフォーム前後・美容室のカット前後といったように、ビフォーアフターを見せたいときに便利なjQueryプラグインです。全部で3つのプラグインを紹介していますが、どのプラグインも簡単に設置できてほとんどのブラウザで問題なく動作する感じです。

  • Tips

Close the search window,
please press close button or esc key.