[CSS]ハック無しでIE6でmax-widthを実現するスタイルシート
CSS HackもJavaScriptもIEの条件付きコメントも無しで、IE6でmax-widthを実現するスタイルシートをCSSplayから紹介します。 'max-width' for Internet Explorer IE6 demo: center 実装のポイントとなるのは左右に配置されたdiv要素で、それぞれマイナスマージンを指定します。 コンテンツを配置するdiv要素には「overflow:hidden;」を指定します。 デモでは上記のmax-widthのコンテンツをセンターに配置したものと左右に配置したものがあります。 'max-width' centered 'max-width' left 'max-width' right
IE 6で泣かないための、9つのCSSハック (1/3) - ＠IT
有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE（Internet Explore）のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー
IE6のバグや仕様の解決方法のまとめ -Ultimate IE6 Cheatsheet
IE6のCSSやJavaScriptなどのバグや仕様で困った時の解決方法をまとめたチートシートをVirtuosi Mediaから紹介します。
GT Nitro: カーレーシング・ドラッグレーシングゲーム - Google Play のアプリ
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
JavaScriptの最適化について、code.google.comの記事の適当訳 - それ図解で。・・・tohokuaikiのチラシの裏
GoogleがWeb全体のスピードアップにいよいよ本格的に着手, 一社だけではできないと強調 からリンクのあった、 http://code.google.com/intl/ja/speed/articles/optimizing-javascript.html が日本語かと思ったら日本語じゃなかった・・・・。 いやー、意外とというか文字列については、全然知らんかった。 Closureって便利だし、「おぉ〜俺って使ってるジャン」みたいな気になれるからついつい使っちゃうんだけど、高コストなのね・・・・。反省。 ということで、超適当翻訳。どっかの誰かが書いてるかも。 前おき 著者: Google Chromeのエンジニア Gregory Baker, Software Engineer on GMail & Erik Arvidsson 推奨される経験：JavaScriptの実践的な知識 クライ
IE8バグ？：a要素内に画像があってa要素に背景を指定した時に位置がずれる
キャプチャ見てもらうと分かるようにIE8だけ極端に位置がおかしい。 IE8がリリースされてから、まだあんまりいじってないのでよく分かってないのですが、今組んでいるサイトをIE8でチェックしたら、「あれ？表示がおかしい...」って事に遭遇してしまったので、エントリー。 よくある感じで、リストのマーカー変わりに背景の指定をa要素にして、そのリスト内には画像テキストが入ってたんです。はい。 毎度のようにサンプルも用意してみました。 サンプルを見る 発生条件は調べた感じa要素内にimg要素があって、a要素にbackgroundプロパティの指定をした時に起こる感じです。 img要素にテキストが隣接してても同様でした。 サンプルみたいなデザインの場合、マーカー部分も一緒に切ってしまう事が多いから過去の案件は大丈夫だと思うけど・・・ 取りあえず、今回のサンプルに使ったソースは以下です。 <ul> <li
IEでJavaScriptを動かす際のメモリリークの調査方法:phpspot開発日誌
Screencast: JavaScript Memory Leaks in the Windows IE Browser IEでJavaScriptを動かす際のメモリリークの調査方法を紹介するスクリーンキャストが公開されており、分かりやすく調査方法について紹介されています。 3分ぐらいの動画になっています。 メモリリークの調査を行うのは、Process Explorer というソフトを使っているようです。 Process Explorer を使えば、Spy++みたいな感じで、調べたいウィンドウ部分にドラッグ＆ドロップして、該当ウィンドウのメモリサイズについて調査できるみたい。 具体的な操作方法については動画を見れば分かります。 メモリサイズがあがっていく様子を捉えた図。 これは知っておいたほうがよさそうですね。
[CSS]外部スタイルシートの指定は@importとlinkでどちらがいいか
外部スタイルシートの指定は@importとlinkでどちらがいいかと、書籍「ハイパフォーマンスWebサイト ―高速サイトを実現する14のルール」の@importはパフォーマンスに悪影響を与えることについてのフォローアップを紹介します。 don't use @import 内容は、IEでは@importで外部スタイルシートを指定すると、パフォーマンスに悪影響を与えるので使用しないでください、というものです。 下記は、外部スタイルシートを@importとlinkを組み合わせて、それぞれのパフォーマンスを比較したもので、キャプチャはそのサイトのものと、参考に当環境でIE7/Fx3(XP)を検証したものです。 @import @import 2つの外部スタイルシートを@importで指定。 <textarea name="code" class="html" cols="60" rows="5">
Ajax - tips - JSONPをブラウザにキャッシュさせない : 404 Blog Not Found
2009年04月13日12:00 カテゴリTips Ajax - tips - JSONPをブラウザにキャッシュさせない というわけで、添削おじさん登場。 [を] 笑い顔顔文字APIを作りました （なお、なぜか IE と Safari だと一回しか動きません。添削希望！）理由は単純で、IEとSafariはJSONPをキャッシュしてしまうのです。 理由がわかれば、解決法も簡単です。たとえば以下のようにしてURIをUniqueにしちゃえばOK. function WarosuJSON(cb){ this.proxy = 'http://mimitako.net/api/warosuapi.cgi'; this.cb = cb; this.count = 0; this.parse = function(cb){ var script = document.createElement('scri
Internet Explorer 8正式版レビュー（1/3） - ＠IT
本稿は、2008年9月17日に掲載した「Internet Explorer 8（Beta 2）クイック・レビュー」というIE8ベータ2をベースにした記事を、正式版の情報に改訂するとともに、いくつかの新情報を追記したものです。 3月19日（日本時間では3月20日）、Internet Explorer 8の正式版（以降、IE8）がリリースされた。IE8では、HTML描画やJavaScript処理の高速化、HTMLやCSSのWeb標準準拠、Ajax関連の機能拡張といったWebブラウザの基本機能の改善と拡張が大きな特徴となっているが、これだけにとどまらず、「Webスライス」や「アクセラレータ」といった新機能（詳細後述）も追加されている。 本稿では、これらの改善や新機能の中で、特にWeb制作やWebアプリケーション開発に関連するであろうものを取り上げ、簡単に紹介する。IE8は以下のリンクから入手でき
IE6,7,8の確認ツールの決定版!?Microsoft Expression Web SuperPreview
IE6,7,8の確認ツールの決定版!?Microsoft Expression Web SuperPreview マイクロソフトのWEBオーサリングツール「Microsoft Expression Web 2」の次期バージョンに含まれる新機能Microsoft Expression Web SuperPreviewがベータ版として公開されました。 このSuperPreviewを利用すればIE6,7,8での検証作業が可能です。(製品版にはFirefox、Safariなども搭載予定) 公式ブログよりダウンロード可能で、インストールには.Net 3.5 frameworkが必要なので結構時間がかかります。 (インストーラーを実行すると最初に.Net 3.5 frameworkをインストールし再起動、次にインストーラーを実行するとSuperPreviewがインストールされる) 検証ブラウザの切り替
IE8における拡大縮小バグ
IE8における拡大縮小バグ 先日リリースされたIE8だが、多くのバグを含んでおり、まだまだWEB製作者を悩ませそうです。 (追記)Firefox3でも発生しますね。検証不足でした。 例えば、私が見つけたのは拡大縮小に関するバグ。(文字ではなくズームによる) ul{ margin:10px; width:600px; border:1px blue solid; } ul li{ list-style-type:none; margin:2px; border:1px red solid; width:194px; height:194px; float:left; display:inline; } サンプル などのようにリスト要素を利用して表状の形態を表現した際、通常は以下のように表示される。 IE8 100%で表示。 これを95%に変更すると以下のようになる。 IE8 95%で表示。
IE1, 2, 3, 4, 5, 6, 7, 8の確認が同時にできる -Internet Explorer Collection
Internet Explorerの異なるバージョン（1, 1,5, 2, 3, 4, 5, 5.5, 6, 7, 8）を同時に起動して、確認ができる「Internet Explorer Collection」を紹介します。 Utilu IE Collection 同時起動できるIEのバージョンは、インストールするWindowsのバージョンによって異なります。 当環境（XP SP3+IE7）では、上記のキャプチャのようにIE1.5, 2, 3, 4, 5, 5.5, 6, 7, 8を同時起動できました。 ※元のIE7には特に影響はありませんでした。 古いバージョンが必要ない場合は、インストール時にチェックをはずせばインストールしないと思います。
Mozilla Re-Mix: IE8のWebスライス機能をFirefoxにも欲しい方へおすすめのアドオン「WebChunks」
IE８の目玉機能であるWebスライスを使えば、オークションの成り行きや天気予報、株価情報などをサイトに移動することなくツールバーから小さなウィンドウをポップアップすることによって確認することができます。 更新情報を素早く確認するという面ではフィードのようでもありますが、個別の情報をサイトから切り取って確認できるのがおもしろいところです。 昨日の記事では、このWebスライス機能をFirefoxで実現するアドオンとして「WebChunks」を記載していましたが、詳細な記事はまだ書いていませんでしたので改めてご紹介いたします。 「WebChunks」は、Firefoxに専用のツールバーを追加して、IE8のWebスライス機能をFirefoxでそのまま利用できるというアドオンです。 アドオンをインストールすると、以下のようなツールバーが追加され、ここに、チェックしたい情報をクリップしていくようになっ
[IE] Internet Explorer 8 ドキュメント互換性モードの指定について
IE6のドキュメントタイプで表示が変わる互換性モードに頭を抱えたWeb業界の人は多かろうと思いますが、IE8で更に上位版が出たそうです。 でもIE6で悪行を働いた標準・互換モードの変更動作とは違い、IE8で導入されたドキュメント互換性は、 IEがページを表示する際に使用する特定のレンダリングモードの選択を可能にするもので、従来のDOCTYPEの変わりに 新しくMETA要素の X-UA-Compatible により操作が可能に。 簡単にまとめると IE8だと表示が崩れる…IE7なら崩れないのに…orz ▼ METAタグでIE7モードで表示するよう指示 ▼ IE8がその指示に従ってIE7っぽくレンダリング ▼ ｳﾏｰ(ﾟдﾟ) ということらしい。 その場合のMETAタグは次のようになる（Emulate IE7 互換性モードを指定） <meta http-equiv="X-UA-Compatib
![[IE] Internet Explorer 8 ドキュメント互換性モードの指定について](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
JavaScriptの動かないコード (中級編) 動的追加したイベントの実行順序 ( addEventListener vs attachEvent ) - 主に言語とシステム開発に関して
連載目次へ 以下のJavaScriptコードが意図した動作をしないのは，なぜですか。（制限時間１分） やりたい事： ボタンへ動的にイベントリスナを追加する。 ボタン押下時に，0, 1, 2 とアラート表示する。 <input type="button" value="「0, 1, 2」と表示" id="my_button"> <script language="JavaScript"> function f0(){ alert( 0 ); } function f1(){ alert( 1 ); } function f2(){ alert( 2 ); } // イベントハンドラ設定 function addEvent( element, eventName, func ){ if ( element.addEventListener ) { // Firefox用 element.add
IE8のドキュメントメモ - ヲゾゾ wozozo ウンコプログラマー 〜綺麗なお姉さん〜
IE8のレンダリングモードは3つ IE8 StandardモードについてはIE8の描画エンジンが利用され、それ以外はIE7互換の描画エンジンが利用されます DOCTYPEによるレンダリング モードの指定 METAタグによるレンダリング モードの指定 <meta http-equiv="X-UA-Compatible" content="IE=8"> content="" の部分を変更する HTTPレスポンス ヘッダによるレンダリング モードの指定 IE8の例 名前：X-UA-Compatible 値：IE=8 レンダリング モード指定の優先順位 META要素 > HTTPレスポンス ヘッダ > DOCTYPE METAタグによる指定がもっとも優先される バージョン管理（制御付きコメント） <head> <title>Test Page</title> <!—[if eq IE7]> IE
IE6 で文章の最後の2文字（くらい）が変なところに表示されてしまう問題の原因と解決法。
Web 制作のことを中心に、ちょっとした Tips などを掲載しています。「自分用メモ」が基本スタンス。 btmup Blog ひょっとしたら定番ネタかも知れないのですが、ググってみても情報が見当たらなかったのでとりあえずメモ。 IE6 で float を使ったレイアウトをしているとき、文章の末尾（最後の2文字くらい）が変なところに表示されるということがあります。 どう変かというと、末尾の文字をそのままコピーしてはみ出たような、そんな感じです。 もちろんソースにそんなものは含まれていません。 JavaScript や PHP なんかを使っている訳ではなく、純粋に HTML と CSS のみでもこのような事象が起こります。 で、とりあえずググってみて見つかったのは下記2つの記事。 »コメント文が出力に影響！？ »IE6のバカヤロウ (room ant) これらを読んで、とりあえず「float
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Google Code Archive - Long-term storage for Google Code Project Hosting.
lepracaun.info