SVG背景画像でwidthとheight属性が100%だとIE11で中央寄せになってしまうバグ
先日、予想外のところでIE11のバグ（現象？）に出くわしたのでメモしておきます。 svgタグのwidthとheight属性に100%が指定されたSVGをCSSで背景画像に指定すると、IE11だけ配置の指定を無視して中央寄せになってしまうバグです。このバグは背景を指定する領域のアスペクト比がSVGのそれと異なる場合に表面化します（アスペクト比が同じ場合、バグに気づきません）。 ※SVG伝道師の松田さんが「一概にバグではないと思う」とツィート されていたので参考までに仕様へのリンクを記事の最後に追記しておきました。 バグが発生する条件とデモ 実際の表示はデモページでご覧ください。IE11で見ると一番最初の三日月だけ、中央寄せになってしまっています。 デモはこちら このバグはSVGとCSSで以下のサンプルコードのような指定をすると発生します。 SVG 下の画像のようにサイズが132 x 160p
ひそかに行われた「IE6暗殺計画」が成功したわけを当時の開発者が語る
by bnpositive 2001年に公開されたInternet Explorerは2014年にサポートが終了するまで長きにわたって使われましたが、後年は、セキュリティ上の問題やバグの多さから「早く殺すべきだ」という声も多方からあがっていました。YouTubeでエンジニアとして働いていたChris Zacharias氏もIE6の対応に苦しめられた1人であり、当時、寝不足の開発メンバーたちによって「IE6暗殺計画」が立ちあがっていたことを振り返っています。 A Conspiracy To Kill IE6 http://blog.chriszacharias.com/a-conspiracy-to-kill-ie6 Zacharias氏によると、当時、特定の環境下になるとIE6はサポートしていないHTMLの属性セレクタの影響によってクラッシュやブルースクリーンの引き金になることがあったとの
若い世代が知らない2000年代のHTMLコーディングの地獄 - ICS MEDIA
ウェブの黎明期である2000年頃と比べてはるかにHTMLはコーディングしやすくなりました。10〜20年前のHTMLコーディングはどのようなものだったのでしょうか。 この記事では、NetscapeとIEのブラウザ戦争に決着がついた後の、IE6が全盛期となった2000年代のウェブサイト制作を振り返ります。懐かさに浸たり、現代のウェブの成り立ちに通じる温故知新な情報として参照ください。 テーブルレイアウト / spacer.gif XHTML・CSSが普及するまではテーブルレイアウトが一般的でした。テーブルレイアウトとはtableタグを使い、格子状にレイアウトしていく手法です。テーブルレイアウトは、デザインファイル（Image ReadyやFireworks）から画像を切り出す「スライス機能」と相性のいい方法でした。 <table border="0" cellspacing="0" cellp
ネットバンキングのWindows10対応
ネットバンキングのＷｉｎｄｏｗｓ１０対応 最近、銀行のＩＴ担当者と話をすると、話題はもっぱらマイクロソフトへの不満ばかりです。というのは、平成２７年７月２９日に開始されたＷｉｎｄｏｗｓ１０無償配布が発端です。今まで主流だったブラウザのＩＥに替わってMicrosoft Edgeが標準搭載されたのですが、銀行がプレビュー版での動作確認をしたところ、多数の問題のあることが判ったからです。業界紙ニッキンなどは、一部の銀行で推奨環境の対象外としたり、利用者に１０へのアップグレードを見合わせるようにとアナウンスしていると報道しました。実際には、一部どころかほぼ全てのIB提供銀行が同様の対応をとっています。海外でも同じような状況です。 面白いのは、単に互換性に問題があるとの告示ではなく、Ｗｉｎ１０の導入を見合わせるようにと、１０に問題があるかのような表現をしていることです。銀行界のＭＳ社に対する不満が読
textarea のキャレット位置に文字列を挿入
JavaScript を使って textarea のキャレット（カーソル）位置に文字列を挿入するサンプルです。 挿入する文字列を入力するために jQuery UI の dialog を利用していますが、それ以外は JavaScript のみを使用しています。 Firefox などの場合は、選択された部分の先頭、末尾の index （整数型）を、それぞれ selectionStart、selectionEnd で取得できますが、IE の場合はそれに該当するプロパティがないのが問題です。 IE の場合は、document.selection プロパティで selection オブジェクト（textarea 要素そのものではなく、textarea 要素の中の選択された文字の部分）を取得し、さらに createRange メソッドを使って TextRange オブジェクトを作成し、それを操作するこ
IE10のDNT(トラックすんなよヘッダー)、Apacheで無視されることになり議論勃発
Apache does not tolerate deliberate abuse of open standards · a381ff3 · apache/httpd · GitHub Apacheの変更で、設計上の欠陥があるDNT(トラックすんなよヘッダー)は、IE10の場合、無視されることになった。これは、クソな規格上、利用者の明示的なDNTの意思表示を求めているためで、デフォルトでDNTを有効にするIE10は、規格違反のブラウザーであるとのことだ。 コミットしたのは AdobeのRoy Fielding、DNTの規格考案者でもある。 DNT(トラックすんなよ、絶対すんなよヘッダー)は技術的に間違っている。もし、ユーザーがcookieと同等技術によるトラッキングを防ぎたいと思えば、cookieを無効にし、Flashを無効にし、localstorageを無効にし、その他、同様の機能を提
Internet Explorer 8 以降でないと Web サーバー側のクリックジャッキング対策が有効にならないらしい: ある SE のつぶやき
クリックジャッキングの対策方法を調べていて分かったのですが、Web サーバー側でクリックジャッキングの対策をしても Internet Explorer 8 以降でないと有効にならないんですね。 Internet Explorer 以外は現在では対応できているようです。クリックジャッキングの攻撃手法が発見されたのが2008年9月で、Internet Explorer 8 がリリースされたのが2009年3月だから Microsoft の対応が遅いわけではないのですけどね。 The X-Frame-Options response header – MDN より Internet Explorer 8 はクリックジャッキングだけでなく、フィッシングサイトやマルウェアのダウンロードブロックなどセキュリティが強化されているので、Windows XP ユーザーは Internet Explorer 8
IE 6, IE 7, IE 8 が退場した未来 - latest log
Internet Explorer の自動アップグレードについて | TechNet 長かった… 本当に長かった… やっと、IE 6, IE 7 が居なくなるのですね… uupaa.js ver 0.8 に埋まっている処理から情報を抜き出し IE 6, IE 7, IE 8 が居なくなった未来では何が可能になるのか抜粋してみました。 IE8 でやっと使えるようになる機能 一部は IE 6 や IE 7 でも使えるのですが、対応が限定的だったり不具合が多かったりと、安心して使えなかった機能も含まれています。 display: inline-block display: table, table-cell など position: fixed; E:active {...} E:focus {...} E::first-child {...} E:lang(C) {...} E::after
SVGをobject要素で活用する | 水無月ばけらのえび日記
更新: 2012年2月24日23時20分頃 SVGというものはずっと昔からありました。かつてはブラウザ側の対応がいまいちで、プラグインを入れたりしないと表示できなかったりもしており、あまり使われていませんでした。しかしIE9がSVGに対応したことで、かなり使えるようになってきた印象があります。最近では仕事でもガチでSVGを使うことが増えてきています。 SVGの特長のひとつは、ベクターグラフィックなので伸び縮みに強いという点です。サイズ可変の領域にうまい具合に背景を敷きたいときには便利です。そして、最近はサイトのコンテンツ全体がサイズ可変ということも増えてきました。というか元々可変ではあると思うのですが、Media Queries (www.w3.org)を使った派手な変更を伴うパターンが増えてきて、画像のサイズを大幅に変更したいケースが増えてきています。 写真などはJPEG画像を拡大・縮小
Facebook 向けウェブサービスは IE6 に対応すべきか ( 2011年12月の Facebook のブラウザシェア ) - IT戦記
はじめに みなさん、お元気ですか＞＜リリースも終わって、一息ついたあまちゃんです！ ヽ(´ー｀)ノわー さて今日は、最近「お花サプライズ！」というサービスをリリースしたのですが、そのときにちょっと面白いデータを見つけたのでそのいきさつも含めて紹介したいと思います。 （今日のテーマはこの円グラフ） フェイスブック系のサービスはどのブラウザに対応すれば良い？ よく、ウェブサービスを開発するときの悩みとして「古いブラウザでのデザインをどのくらいケアするか？」というものがあります。 「お花サプライズ！」でも、割と短い期間で実装することを目標としていたり、本番の HTML を書いた経験があまりないメンバーが多くいたことで「IE6 や IE7 への対応が鬼門なんじゃないか？」という心配が常にありました。 そこでよぎる甘い誘惑 このご時世、 IE6 とか IE7 に特別対応する必要なんてないんじゃね？
Firefox 4のサポート打ち切りに企業から不満の声、MicrosoftはIEをアピール
Firefox 4のサポートが打ち切られたことに対して企業などから不満の声が出ている。Microsoft幹部はこの機会を使ってIEの売り込みに乗り出した。 MozillaがFirefox 4のサポートを打ち切ってFirefox 5に移行したことに対し、企業などから不満の声が出ている。Microsoft幹部はすかさずこれに便乗する形で、Internet Explorer（IE）のサポート態勢をアピールした。 Mozillaは6月21日にFirefox 5の正式版と、Firefox 3.6の更新版となる3.6.18をリリースした。しかしFirefox 4の更新版はリリースされず、Firefox 5がFirefox 4のアップデートになるという扱いだった。 これに対し、IBMなどの大企業でFirefox関連の開発にかかわってきたコンサルタントのマイク・カプリー氏は自身のブログで、Mozillaが
Leak Free Javascript Closures
October 20, 2005 Javascript closures can be a powerful programming technique. Unfortunately in Internet Explorer they are a common source of memory leaks. Therefore I propose a method to create closures that don't leak memory. Problem First start with a short explanation of the problem I tried to fix. Here is an example of a simple event handler (IE only for clarity): function attach() {
.aspx)
Internet Explorer リーク パターンを理解して解決する
Justin Rogers Microsoft Corporation June 2005 日本語版最終更新日 2006 年 2 月 3 日 Web 開発者の進化 以前は、メモリ リークは Web 開発者にとって大きな問題ではありませんでした。ページは比較的単純に保たれ、サイト内の異なるロケーション間のナビゲーションは解放されたメモリをクリーンアップするうえで優れた方法でした。リークがあった場合も、たいていは気付かないほど小さなものでした。 新しい Web アプリケーションは、より高い標準に従います。ページはナビゲートされずに何時間も実行され、Web サービスを通じて更新情報を動的に取得する場合があります。複合イベント スキーム、オブジェクト指向の JScript、およびアプリケーション全体を生成するためのクロージャを組み合わせることで、言語機能が限界点に達します。これらの変更およびその他
DOM オブジェクトとメモリリーク: Days on the Moon
IE でのメモリリーク ちょこちょこと紹介されているので知っている人も多いと思うが、IE には DOM ノードに絡んだメモリリークの問題がある。これに関しては Microsoft 自身の記事である「Understanding and Solving Internet Explorer Leak Patterns」に詳しいが、簡単にいえば DOM ノードオブジェクトに関する循環参照を作ると、IE を終了させるまでそのオブジェクトが解放されないというものだ。記事によればメモリリークには以下のようなパターンがあるという。 1. 単純な循環参照 ある DOM ノードオブジェクトのプロパティをたどっていくと自分自身に行き着く場合。以下のようなパターンが考えられる。 element.property == element element1.property1 == element2, element2
ppBlog - IEのメモリリーク問題
IEあるいはIEエンジンのブラウザ(Sleipnirとか)を使っていて、どうもページの描画速度が遅い気がする―もっと正確には最初にページを開いたときより遅くなった―と感じたことはないだろうか？ 特にあなたがJavaScriptを多用したページを開いているならば、もしかしたらIE特有のメモリリーク問題(IE memory leaks problemG)が原因かもしれない。 余談ですが、前回のmoblogエントリーは、自分のブログにモブログしたつもりが間違ってこちらにエントリーしてしまいました。気が向いたら移動しておきます。 で、本題ですが、この問題はより多くの利用者が（IEエンジンの）タブブラウザーを使うようになればなるほど顕在化してくると思われるのでメモしておこうと思います。ppBlogでもJavaScriptは欠かせませんし。最初に言っておきますが、この問題はIE4-6に特有のもので他の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
いまさらだけど、マイクロソフトのウワサのブラウザ「Edge」についてまとめてみた
IE10 table-layout:fixed broken if colspan is used
Microsoft Learn: Build skills that open doors in your career
マイクロソフト、GoogleはIEのプライバシー設定も迂回と非難 (※P3Pの件) -- Engadget Japanese
DOM & checkbox(checked status)