バグのjQueryアニメーションコード？

背景の色をアニメーション化するためにテキストの色をアニメーション化するためのコードをいくつか修正しました。しかし、コードは少しばかりです。クロムでは、最初のホバーオーバー時に背景が白に変わり、すべてのブラウザーでは読み込みに時間がかかります（違いがある場合はプラグインがサーバーに保存されています）ので、数秒待ってから効果。ここでは、コードは次のとおりです。バグのjQueryアニメーションコード？

$(document).ready(function() { 
    $(".olli").hover(function() { 
     $(this).stop().animate({ backgroundColor: "#e8e5e2" }, 500); 
    },function(){ 
     $(this).stop().animate({ backgroundColor: "#dbd6d0" }, 500); 
    }); 
});

.olliクラスは、このから来ている：

$("#ulnav > li").addClass("olli");

出典

2011-01-23 Jake

通常のアニメーションは色をアニメーション化できません。このために別のプラグインを使用することができます：http://plugins.jquery.com/project/color –

@Shadow：OPにはjQueryUIがロードされています。これにより、色をアニメートできます。 – user113716

@Pat cool、それを知らなかった。 –

あなたがバックグラウンドの初期色が設定されていません。計算されたスタイルは、（Chromeでとにかく）background-color:transparentので、出発点がのために必要とされる

$(".olli").hover(function() { 
    $(this).stop().animate({ backgroundColor: "#e8e5e2" }, 500); 
},function(){ 
    $(this).stop().animate({ backgroundColor: "#dbd6d0" }, 500); 
}).css({ backgroundColor: "#dbd6d0" });

または

.olli { 
    background-color: "#dbd6d0"; 
}

：色「オフ」にCSSでそれを設定し、またはこれを行うのいずれかアニメーション、およびjQueryUIは#FFFを使用する必要があります。

（右 #contentセクションの後）だけ上記分析コードを <head>からあなた <script>タグを削除し、それらを置き、ゆっくりと負荷の問題を回避するために、そして .ready()コールを取り除きます。

EDIT：

あなたは.ready()コールを削除するときにこれを行うことができます。グローバル変数の作成を防ぎます（変数があれば）。

(function($) { 

    $(".olli").hover(function() { 
     $(this).stop().animate({ backgroundColor: "#e8e5e2" }, 500); 
    },function(){ 
     $(this).stop().animate({ backgroundColor: "#dbd6d0" }, 500); 
    }).css({ backgroundColor: "#dbd6d0" }); 

})(jQuery);

出典

2011-01-23 14:10:01 user113716

問題は、サーバーが解析コードを生成すると思うので、スクリプトファイルをその上に置くことはできません。 .ready（）コールを削除することについて、あなたはそれがどのように見えるかを教えてくれますか？あなたの助けをありがとう – Jake

それは働いて、本体セクションの終わりにスクリプトを移動し、全体の.readyの行を削除します。本当にありがとう！ – Jake

@Jake：あなたは ''に '

あなたのサイトからこのコード行を削除してください。

<!-- www.000webhost.com Analytics Code --> 
<script type="text/javascript" src="http://analytics.hosting24.com/count.php"></script> 
<noscript><a href="http://www.hosting24.com/"><img src="http://analytics.hosting24.com/count.php" alt="web hosting" /></a></noscript> 
<!-- End Of Analytics Code -->

マイブラウザには、count.phpファイルをロードできませんでした。したがって、あなたのJS-Codeは動作しません。なぜなら、あなたの$(document).ready(function() {は真ではないからです。

出典

2011-01-23 14:10:39

私はそれについて何もできません：/それは私のローカルファイルではないので、無料のWebホスティングが必要です。それは読み込みにそれほど時間がかかりますか？ – Jake

はい！それをテストするために '$（document）.ready（function（）{{ - }節を削除します。しかし、私は完全に確信しています。 –

これはローカルでは機能しませんか？私はWAMPサーバを稼働させています – Jake

バグのjQueryアニメーションコード？

答えて

関連する問題