3

このコードのビット:

$(div).stop().animate({ 
    fontSize: "+=20%",
}, {
    duration: duration2,
    easing: "easeOutBack"
});

フォント サイズを 20% 大きくする必要があり、何らかの理由でフォント サイズを小さくするChrome を除くすべてのブラウザでそうなります。

具体的には、私が取り組んでいるページはhttp://dl.dropbox.com/u/67774614/letters/letters.htmlです。文字を入力してドロップすると、文字のフォントサイズが大きくなり、マウスオーバーでジャンプして赤くなります。Chrome では、(誤って) フォント サイズを小さくする必要があります。

問題は、このスクリプトの 82 ～ 90 行にあります: http://tny.cz/49bc46f7

提案されているフィドルは次のとおりです。http://jsfiddle.net/cZEzy/1/

4

3 に答える 3

3

初期の font-size を設定する必要があります。コードを見ると、letter.css にはデフォルトの font-size が指定されていません。

の回答のコードを使用して、Alex Milewskiそれを拡張します。

基本的な HTML:

<div id="org">Stuff1</div>
<div id="the">Stuff2</div>

そして基本的なスクリプト：

$('#the').animate({ 
    fontSize: "+=20%",
}, {
    duration: 2000,
    easing: "easeOutBack"
});

問題を再現するデフォルトのフォントサイズはありません：

デモ- 問題が再現されました

以下のようなデフォルトのフォントサイズを使用すると、問題が修正されます。

body{
    font-size: 20px;
}

デモ- デフォルトのフォントサイズを使用

于 2013-03-16T22:57:03.460 に答える
0

なぜこれがChromeで起こっているのかよくわかりません。

簡単な回避策は、フォント サイズを変数として定義し、手動でインクリメントしてから、アニメーション中にその変数をパラメーターとして使用することです。

Var fontsize = $(div).css('font-size') * 1.2;
$(div).stop().animate({ 
    fontSize: fontsize,
}, {
    duration: duration2,
    easing: "easeOutBack"
});
于 2013-03-16T22:42:10.397 に答える
0

おそらくあなたのCSSだと思います：このフィドルはあなたのコードを使用し、私のChromeでうまく機能します...

$('#the').animate({ 
    fontSize: "+=20%",
}, {
    duration: 2000,
    easing: "easeOutBack"
});
于 2013-03-16T22:49:04.117 に答える