レスポンシブデザインでPCとスマホで画像を切替える方法 | スターフィールド株式会社
レスポンシブデザインでwebサイトを制作することが多くなってきていますが、 その中でスマホの場合を考えられてないケースが多々あります。 本来であればレスポンシブの構造上、スマホファーストで考えるべきところなのですが、 PC先行でデザインし、後でスマホをどうにかするってパターンになってしまっています。。。 そういった場合、 レスポンシブデザインはもちろん同じ一つのソースなので、 同じ画像ではダメなことがあります。 しっかりスマホファーストで考えていても、 PCは横長でスマホは縦長なので、 サイズを違うものにしたい場合もあると思います。 そんな時、PCとスマホで画像を切り替える必要があります。 元々htmlに両方書いておいて、 cssでdisplayをnoneやblockにするというあまり良くない方法もありますが、 今回はjQueryを使用した方法をご紹介します。 jQueryを使ってレスポン
UXの効果が数字でわかる！5つのUX KPI : DeNA Creator(クリエイター) Blog
プログラミング教育や社員の健康をサポートする「CHO室」の取り組みなど、DeNAのCSRに関する情報を発信するブログ
[JS]これは楽しい！スマフォUIのように下に引っ張るとリフレッシュするスクリプト -Hook.js
スマフォやタブレットのように、下に引っ張るとページをリフレッシュするjQueryのプラグインを紹介します。 Hook.js 最上部に戻ってからの上方向スクロールでもリフレッシュするようです。 普通のページではリフレッシュするシーンがあまりないですが、何かに使いたいな、、、 Hook.jsの使い方 実装は簡単で、2ステップです。 Step 1: 外部ファイル 「jquery.js」と当スクリプト・スタイルシートを外部ファイルとして記述します。 <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> <link rel="stylesheet" href="hook/hook.css" type="text/css" /> <script src="hook/hook.js"
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
