[Javascript] IE8で、キャッシュから画像を読み込んだ時にimgタグのonloadイベントが動作しない場合の回避策
Javascriptをコーディングしていて、IEだけ意図した動作を示さないということはあまりに数多く遭遇するトラブルの一つである。 特にIE9以前のバージョンではそれが顕著であり、そのことに頭を悩ませるのにはもはや慣れたという人も多くいる筈である。この投稿では、IE8で遭遇した不思議な現象についてである。 img要素にonloadイベントをくっつけると画像のロード完了時に関数を実行する事ができるのだが、IE8ではimg要素の画像がキャッシュからロードされるとき、onloadイベントが実行されない。 1. キャッシュから読み込んだ時にonloadイベントが動作しないコード var img = document.createElement("img"); img.src = "画像のパス"; img.onload = function(){alert("読み込んだよ！")}; parentEl
![[Javascript] IE8で、キャッシュから画像を読み込んだ時にimgタグのonloadイベントが動作しない場合の回避策](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)
画像をCSSだけでハイクオリティに縮小サムネイル化する方法:phpspot開発日誌
Tip: High quality CSS thumbnails in IE7 ・Devthought 画像をCSSだけでハイクオリティに縮小サムネイル化する方法が紹介されています。 普通、IEで、img に対して、width, height 指定すると、画像が汚く縮小されちゃってましたが、CSSの指定をしちゃうとそれが解決されるということのようです。 具体的には以下のCSS指定によってそれが可能みたいです。 img { -ms-interpolation-mode: bicubic; } デモページ う〜ん、縮小してもとっても綺麗です。 FirefoxやChromeの場合は何も指定しなくても綺麗に縮小される、っていうのも知りませんでした。 これは、サーバサイドでサムネイルを生成しなくて良くなる場面が出てきて開発者としては手間の削減になりますね。 転送量を考えれば、サムネイルが完全に不要に
PHPで表示したjpeg画像が、IEだとbmp画像でしか保存できない問題
こんにちは、牧野です。 先日、年明けに開かれる好きなアーティストのライブのチケットを買いました。 前のライブイベントはチケットが売り切れて残念でしたが、今回は大丈夫でした。 さらに、今度はものすごくいい席（前から４列目！）になったので、今からとても楽しみです。 さて。今日は久々にPHP関係のネタです。 前、PHPでjpeg画像を出力して表示するプログラムを作ることがありました。 その時、IEでアクセスして、表示されたjpeg画像を保存しようとすると、何故かbmpと判断されるという問題が。。。次のは再現画像です。 プログラム自体はログインチェック後に読み込んだ画像を出力するようなシンプルなもので、Firefoxではちゃんとjpegと判断されます。 IEからjpeg画像ファイルに直接アクセスして表示した場合も大丈夫です。 最初、header関数でContent-Typeだけ出してContent
アルファ画像を扱うalphafilter.jsライブラリ[to-R]
アルファ画像を扱うalphafilter.jsライブラリ IE6でアルファ画像(透過png)が使えないことにより、コーディングの作業量が大幅に増します。 そこで、IE6で透過pngを扱うjsライブラリを作ってみました。 設定は簡単、head要素内に条件付きコメントを利用してalphafilter.jsで読み込むだけ。 読み込みを高速化させるためdefer属性をの記述を忘れずに行ってください。 <!--[if lte IE 6 ]><script type="text/javascript" defer="defer" src="./alphafilter.js"></script><![endif]--> 透過にしたい画像にclass属性でalphafilterと入れるだけで、なんとIE6でも透過画像の使用が可能になります。 <img src="./sample.png" class="a
![アルファ画像を扱うalphafilter.jsライブラリ[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Fblog.webcreativepark.net%2Ficon_200x200.png)
透過PNGの罠 - AUSGANG SOFT
IE7で透過PNGがサポートされて、以前からもありましたが、透過PNGをIE5.5、6でも表示させるJSライブラリがいくつか出ています。 これらのライブラリは、IE独自のAlphaImageLoaderフィルターを利用して擬似的に透過PNG表示をさせています。 でも、このAlphaImageLoaderフィルターには、癖があって、それで以前にハマったことがあります。 実例 IE6(5.5)で見てください。 吹き出しの中のLingerへのリンクをクリックして移動することができますか？ 原因 原因がさっぱりわからなかったので、ライブラリの中身を見て、AlphaImageLoaderで検索したところ以下の情報が。 PNG ちょっと裏技 (2) http://www.minc.ne.jp/~konda/new/png/urawaza02.html アルファイメージローダーを使用した要素(タグ)の内
アルファ画像を扱うalphafilter.jsライブラリ-とあるWEBクリエイターのblog
IE6でアルファ画像(透過png)が使えないことにより、コーディングの作業量が大幅に増します。 そこで、IE6で透過pngを扱うjsライブラリを作ってみました。 設定は簡単、head要素内に条件付きコメントを利用してalphafilter.jsで読み込むだけ。 読み込みを高速化させるためdefer属性をの記述を忘れずに行ってください。 <!--[if lte IE 6 ]><script type="text/javascript" defer="defer" src="./alphafilter.js"></script><![endif]--> 透過にしたい画像にclass属性でalphafilterと入れるだけで、なんとIE6でも透過画像の使用が可能になります。 <img src="./sample.png" class="alphafilter" alt="" /> 背景に透過pn
ウノウラボ Unoh Labs: IE6でアルファチャンネルを含むPNGを表示する
yamaokaです。 webサイトで背景が透明な画像を使用する場合、画像を透過GIFまたはアルファチャンネルを含むPNGで作成する必要があります。どちらを使用してもかまわないのですが、下図のように背景を指定した場合はPNGの方がきれいにアンチエイリアスがかかります。 透過GIFとアルファチャンネルを含むPNGの比較 posted by (C)フォト蔵 PNGを使いたくなるところですが、Internet Explorer 6（以下IE6）はアルファチャンネルに対応していないので、一工夫する必要があります。IE6でアルファチャンネルを含むPNGを表示するには、IE6のフィルタ機能であるAlphaImageLoaderを使用します。フィルタを使用すると、画像としてではなく要素の背景のように振る舞います。したがって、表示させるにはIE6でアクセスがあった場合のみ以下のような処理を行えばよいことにな
Ajax Cookbook - PNG Images with Alpha Transparency
Internet Explorer does not support 24-bit PNG images with alpha transparency, as has been well documented around the Web (here are just a few: 1, 2, 3, 4). The crux of the "solution" to this problem is to use an Internet Explorer filter called AlphaImageLoader. AlphaImageLoader can be applied to a div element to display a PNG image properly using DirectX. The difficult part of the problem is that
PNG in Windows IE
The PNG problem in Windows Internet Explorer Home | The Problem | The Solution | How To Use | More Info This site is all about a JavaScript-based PNG fix for Internet Explorer 5.5 and 6 on Windows. The fix allows IE to properly render PNG alpha transparency. If you want to get straight to the script, go to the how-to page and follow the instructions there. If you have the time for a descript
PNG-24 Alpha Transparency With Microsoft Internet Explorer 5.5 or better (MSIE 5.5+)
A PHP solution to fixing the display of PNG-24 images with alpha transparency in Microsoft Internet Explorer.PNG-24 Alpha Transparency with MSIE PNG-24 images with alpha transparency display with a solid gray color as the background by default in Windows versions of Microsoft Internet Explorer. This is because MSIE does not natively support the multiple levels of transparency. The browser does ho
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
usrb.in
透過PNGをCSSで背景に指定してIE6や5.5のバージョンでも綺麗に表示してみる - DesignWalker
ユンサンの／／YungSang's: 透過PNG と IE と IE7
Symfony, High Performance PHP Framework for Web Development