Web Design Leaves

Firefox の最新バージョン（22.0）になってから、この PC では画像が大きく表示されぼやけて見えるようになった。

また、コードなどを記述する pre 要素にマウスオーバーすると幅が自動的に広がるようにする機能を jQuery で以下のように記述して実現していたが、マウスアウトする際に、今までは元の幅に自動的に戻っていたのに、戻らなくなった。（「jQueryで文字数により表示幅を変える」）

但し他のブラウザ（IE, Chrome, Safari）では問題がない。

jQuery(document).ready(function($) {
//シンタックスハイライト部分の幅の調整
var prettyprint_width = $(‘#contents pre.prettyprint’).width(); //シンタックスハイライト部分の幅
var expandWidth = 840; //拡大する際のシンタックスハイライト部分の幅の値
$(‘#contents pre.prettyprint’).hover(
function() {
var prettyprint_comparison_width = 590; //比較の基準とする幅（＊）
var that = $(this);
var li$ = that.find(‘li’); //’li’要素のラップ集合
var maxWidth = 0; //各行の幅の最大値を初期化
li$.each(function() { //各行に含まれる’span’要素の幅を合計し、その最大値を取得する
var spanWidth = 0; //各’span’要素の幅の合計値を初期化
$(this).find(‘span’).each(function() {
spanWidth += $(this).width();
});
maxWidth = Math.max(maxWidth, spanWidth);
});
if(prettyprint_comparison_width < maxWidth) { //各行の幅の最大値が比較の基準とする幅の値より大きければexpandWidth（840）まで拡大 that.not(":animated").css({whiteSpace: 'pre-wrap', position: 'relative', zIndex: 10}).animate({width: expandWidth}, 100); }else{ return; } }, function() { if($(this).width() == expandWidth) { //シンタックスハイライト部分の幅が拡大されていれば元に戻す $(this).css({whiteSpace: 'pre'}).animate({width: prettyprint_width}, 100); } }); }); [/code] 上記の最後の方の「 if($(this).width() == expandWidth) 」の条件を外すと、以前と同じように自動的に幅が元に戻るようになった。これはおそらく何らかの理由で要素の幅（$(this).width()）が変わってしまうためと考えられる。 Firefox のバグかと思って検索したところ次のサイトが見つかった。 22.0の表示が、大きくなって画像がぼやける。直せないでしょうか

layout.css.devPixelsPerPx の値を「1.0」に変更したところ、jQuery を元に戻しても機能することが確認できた。