スマホ対応の参考に。JavaScriptでウェブページがどのくらい拡大されているのかを取得する方法。
こんにちは。開発担当の林です。 iPhone / iPad のウェブブラウザでページを見ているとき、けっこうな割合でピンチイン・ピンチアウトすると思いますが、それがどのくらい拡大されているのかを取得する方法を書きます。 また、応用でピンチイン・ピンチアウトされても、見た目のサイズを維持するにはどのくらい拡大すれば良いかということにも触れたいと思います。 広告バナーなんかでよく使われてるアレの仕組みです。何かのお役に立てれば幸いです。 ウェブページがどのくらい拡大されているのかを取得する // ページの幅 ÷ 表示されている幅（この行だけでいいかな） var zoomer = document.body.clientWidth / window.innerWidth; // 以下で拡大率を目視できるでしょう alert( zoomer ); // 小数点がたくさんつくので、第二位までに丸め込
Archived Page
This page is no longer being updated with new content. Go to the ABC News homepage for the latest top stories, browse topics to find news you're interested in, or use search to find what you're looking for. Download the app now by tapping below on the relevant app store button for you. Download the ABC News app on the App Store Get the ABC News app on Google Play
ONE PIECE 渋谷 ジャック 広告コンプリート！｜***yokoichi.7th Log
***yokoichi.7th Log フォトグラファーよこいちの日々徒然 書き綴りブログ プロフィール プロフィール｜なう｜ピグの部屋 ニックネーム：よこいち 誕生日：1985年10月15日 0時頃 お住まいの地域：東京都 自己紹介： 事業家フリーカメラマン。 人生１回！最後まで楽しんじゃおう★ ブログジャンル：ハッピーライフ/夢への道のり メッセージを送る アメンバーになる プレゼントを贈る [記事作成・編集] ブックマーク よこいちの目次 写真作品ブログ もうひとつのブログ [一覧を見る] [katyos.Lab] ブログテーマ一覧 ブログ ( 36 ) 日々の１コマ ( 7 ) 戯言。 ( 4 ) 知識 ( 2 ) いい言葉。 ( 2 ) 経済 ( 2 ) レビュー ( 3 ) エンタメ ( 3 ) アーカイブ 2011年01月 ( 4 ) 2010年12月 ( 1 ) 2010
Googleインスタントプレビューで使われているdata URLスキームを使った画像の表示 - buzzword update
2010年11月22日月曜日 Googleインスタントプレビューで使われているdata URLスキームを使った画像の表示 先日からGoogleインスタントプレビューに関連する記事を書いていましたが、今日は表示されている画像についてです。ブラウザでプレビュー画像が表示された後で画像のURLを取得してみます。 普通は表示されている画像ファイルのURLが取得できるのですが、プレビュー画像の場合は次のような値が取得できました。 非常に長い値が設定されています。先頭の部分だけ取り出すと次のような感じです。 data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAA0JCg... これはつまりimgタグに対してこんな感じで記述されているということです。 <img src="data:image/jpeg;base64,/9j/4AAQS
PHPで画像のリサイズ等が簡単に行えるクラス:phpspot開発日誌
PHP Image Resizer Class : Milaju PHPで画像のリサイズ等が簡単に行えるクラスが公開されています。 こうしたライブラリは同様のものが存在するのですが、便利そうなので公開。 次のように実装時に分かりやすいコードでかつ簡単にリサイズが可能です。リサイズだけではなく、クオリティやmaxサイズといったオプション指定も出来るようになってます。 require_once('class.imgsizer.php'); $imgSizer = new imgSizer(); $imgSizer->type = "width"; $imgSizer->max = 100; $imgSizer->quality = 8; $imgSizer->square = true; $imgSizer->prefix = "sml_"; $imgSizer->folder = "_siz
IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」:phpspot開発日誌
IMGr :: jQuery Image Rounder IEでも動作する画像を超簡単に角丸化できるjQueryプラグイン「IMGr」 $("imageElement").imgr(); と唱えるだけでクロスブラウザで画像の角を丸くすることが可能です。 $("imageElement").imgr( optoins ); でradiusやサイズ、色のカスタマイズが可能。 赤いボーダーで角丸の例 ボーダーを消した例 四方の角丸の操作も自由自在です。 IE 6, IE 7, IE 8, FF 3.6, Chrome 6.0, Safari 5.0, Opera 10.62 のブラウザ上でテストされているそうです。 関連エントリ CSSで角丸テクニック２５ 角丸を使った可愛いカレンダーピッカー実装JavaScript「jsDatePick」 CSS3で影付き角丸グラデーション付きのボタンを作成す
Google Chart API でアイコンを作る « Stop Making Sense
はじめに パレート図、レーダーチャートに続き、動的アイコン作成です。今回はグラフではありません。 (参考) Dynamic Icons のページ サンプル それほど難しくないので、どんな画像が作れるかサンプルを挙げていきます ロゴ http://chart.apis.google.com/chart ?chst=d_text_outline &chld=4169E1|26|h|FFA500|_|GraphViz+Workspace 以前作ったGAEアプリでは、ロゴの画像を作るのが面倒だったので、Google Chart API で作ってもらいました 動的ロゴ javascript を使えば、動的に変化するロゴも出来ます。アクセスカウンタ等の用途で使えるかも
Google、Web高速化を目指し新画像フォーマット「WebP」を発表
Google、Web高速化を目指し新画像フォーマット「WebP」を発表：JPEGより約40％コンパクト GoogleがJPEGに代わる画像フォーマットとしてVP8技術を応用した「WebP」を発表。Webページの65％を占めるという画像を圧縮することでWeb高速化を促進する狙いだ。 米Googleは9月30日（現地時間）、新たなオープンソースの画像フォーマット「WebP」を発表した。Webに掲載する写真などの画像サイズを大幅に縮小でき、Webサイトの読み込み速度を向上させるという。開発者向けプレビュー版がGoogle codeのサイトからダウンロードできる。 Web高速化を目指す同社は、これまで高速化のためのさまざまなツールを投入してきた。ユーザーのWeb体験を遅くする主な原因はWebを構成する画像の読み込み速度にあると考え、新フォーマットの開発に取り組んだという。Googleによると、画像
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
