スマホ・タブレットのブログデザインをマテリアルデザイン風にしてみました！ - Yukihy Life

2015/11/25 24 users Yukihy Life スマホ・タブレット ブログデザイン

2015 -11 -25 スマホ・タブレットのブログデザインをマテリアルデザイン風にしてみました！ Web制作 Tweet もうタイトル通りなのですが、このブログのデザインを流行りのマテリアルデザインに寄せるようにしてみました！ どのあたりを変えたのかを備忘録がてら書いていきたいと思います。 （変更したのはタブレット・スマホ版のみですが、PCでもブラウザサイズを縮めるとなります） なぜ変えようと思... 続きを読む

レスポンシブな円グラフが描画できる「Pizza Pie Charts」:phpspot開発日誌

2013/11/26 18 users Pizza Pie Charts phpspot開発日誌

レスポンシブな円グラフが描画できる「Pizza Pie Charts」 2013年11月26日- Pizza Pie Charts | Playground from ZURB レスポンシブな円グラフが描画できる「Pizza Pie Charts」 次のような円グラフ、ドーナツ型の円グラフが描画可能。マウスカーソルに応じてインタラクティブに動作する他、ブラウザサイズに応じて最適なサイズにリサイズさ... 続きを読む

レスポンシブWebデザインがユーザー体験に最適化できていない5つの実例 | SEO Japan

2013/09/12 139 users 実例 レスポンシブWebデザイン SEO Japan 5つ

スマホの普及で導入サイトも増えているレスポンシブWebデザイン。作り手からするとまだまだ目新しいですし、ブラウザサイズを変えてサクッとデザインが柔軟に変わるのはそれなりに自己満足度も高く時代の最先端を走っている気分になれる仕組みではあります。一方、デバイスやスクリーンサイズにデザインが最適化できたとしても、それがそのデバイスを使っているユーザーに本当に最適化できているかというと、全くの別問題。Go... 続きを読む

ブラウザサイズに応じてsrcやwidthを置き換えてくれるjQueryプラグイン「Responsive Img」:phpspot開発日誌

2012/11/22 280 users src width jQueryプラグイン 画像

ブラウザサイズに応じてsrcやwidthを置き換えてくれるjQueryプラグイン「Responsive Img」 2012年11月22日- Responsive Img - a jQuery Plugin for Responsive Images ブラウザサイズに応じてsrcやwidthを置き換えてくれるjQueryプラグイン「Responsive Img」 単に画像をリサイズするだけではなくs... 続きを読む

jQuery Responsive Tile Gallery - レスポンシブレイアウトに対応した画像ギャラリー | CREAMU

2012/10/31 31 users CREAMU レスポンシブレイアウト 画像ギャラリー

jQuery Responsive Tile Galleryは、レスポンシブレイアウトに対応した画像ギャラリーです。 ブラウザサイズを変更すると、すっとアニメーションしながらレイアウトが変更されます。 jQuery Responsive Tile Gallery 続きを読む

IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」:phpspot開発日誌

2012/10/09 32 users iframe内 jQueryプラグイン レスポンシブ対応

IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 2012年10月09日- ResponsiveIframes.js IFrame内もレスポンシブ対応にするjQueryプラグイン「ResponsiveIframes.js」 ページ内や画像をレスポンシブ対応にするものはありますが、ページ内に貼りつけたiframeでさえもブラウザサイズに応じて伸... 続きを読む

画像や動画をブラウザサイズに合わせて比率を変えずに拡大縮小させるためのCSSの書き方。 → Rundown of Handling Flexible Media | CSS-Tricks - コメンター

2012/09/19 12 users コメンター That is CSS-Tricks CSS 比率

Rundown of Handling Flexible Media | CSS-Tricks - When you take the responsive web design route, part of the deal is fluid grids. That is, container elements set in percentage widths. Just one example... 続きを読む

ブラウザサイズに合わせて背景画像などをフィットさせるjQueryフルスクリーンプラグインいろいろまとめ6つ(動画・全画面スライドショー) - W3Q

2012/05/15 88 users 背景画像 W3Q 動画

bgStretcher jQuery Plugin Allows to Add Background Image to Page and Proportionally Resize it to Fill Entire Window Area. — ajaxBlender.com 続きを読む

ブラウザサイズに応じて全体に広がる背景を実装できるjQueryプラグイン「Backstretch」:phpspot開発日誌

2012/03/21 54 users Backstretch jQueryプラグイン 背景 全体

ブラウザサイズに応じて全体に広がる背景を実装できるjQueryプラグイン「Backstretch」 2012年03月21日- Backstretch: a simple jQuery plugin that allows you to add a dynamically-resized background image to any page ブラウザサイズに応じて全体に広がる背景を実装できるjQ... 続きを読む

ブラウザサイズに合わせて貼り付けた動画を自動的にリサイズしてくれる『FitVidsJS』 | IDEA*IDEA

2011/09/07 42 users IDEA リサイズ jQueryプラグイン デバイス 以下

あ、これ、どこかで使いそうなのでメモ的にエントリー。 こちらのjQueryプラグインを使えば、貼り付けた動画がResponsive Designに対応してくれますよ（つまりブラウザサイズにあわせて自動的にリサイズってことですな）。 FitVids from Dave Rupert on Vimeo. ↑ 説明動画はこちら。 詳細＆ダウンロードは以下からどうぞ。デバイスが多様化しつつありますからね・... 続きを読む

並べた画像を敷き詰めて超カッコよくするjQueryサンプル:phpspot開発日誌

2011/09/05 629 users jQueryサンプル phpspot開発日誌 画像 img

Automatic Image Montage with jQuery | Codrops 並べた画像を敷き詰めて超カッコよくするjQueryサンプル。 <img>を単に並べるだけであとはブラウザの幅に応じて画像を次のように並び替えてくれちゃうデモとスクリプトのダウンロードが可能です。 画像間の調整や背景色の調整等が行えるようです。 デモページはこちら ブラウザサイズを変更しても画像を再計算して表... 続きを読む

ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」:phpspot開発日誌

2011/08/30 86 users jQueryプラグイン phpspot開発日誌 解像度

ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」 2011年08月30日- jQuery browserSizr | jQuery Plugins ブラウザサイズに応じてclass名を自動で付け替えてくれるjQueryプラグイン「browserSizr」。 スマートフォンや色々な解像度のPCがあるご時世ですが、ブラウザのサイズに応じてコンテ... 続きを読む

ブラウザのサイズに合わせて画像を伸縮する作業を全自動化するjQueryプラグイン「maxImage」:phpspot開発日誌

2009/10/26 223 users PEAR jQueryプラグイン phpspot開発日誌

PHPからbit.lyやtr.im等のURL短縮サービスをまとめて扱える「PEAR::Services_ShortURL」 ブラウザのサイズに合わせて画像を伸縮する作業を全自動化するjQueryプラグイン「maxImage」。 このプラグインを使えば、画像のサイズをブラウザサイズの変更があったとしてもページのサイズに合うように調整してくれ、デザイン崩れを防ぐことが出来ます。 以下にその機能を紹介し... 続きを読む