この問題は私を完全に狂わせており、どんな助けにも本当に感謝しています! 奇妙な理由で、最近開発したサイトの背景画像が Chrome に表示されないことがあります。Chrome のキャッシュの問題と関係があると思います。このサイトの他の投稿ですべての修正を試みました。このサイトは、Mac の Safari と Firefox で正常に動作します...
Watch、About、Filmmakers、Press、Contact の各ボタンをクリックすると、jquery を使用して各 div をフェードインし、他のすべての div をフェードアウトします。各ページの背景画像は、css ファイルで定義されています。各 div には独自の background-image:url が定義されており、すべてのプロパティが定義されています。
#watch, #story, #about, #cast, #filmmakers, #press, #contact {
position:absolute;
top:190px;
left:50%;
margin-left:-575px;
width:955px;
height:608px;
display:none;
}
#watch{
background-image:url(../images/bg-watch.png);
}
#about{
background-image:url(../images/bg-about.png);
}
#filmmakers{
background-image:url(../images/bg-filmmakers.png);
}
#press{
background-image:url(../images/bg-press.png);
}
#contact{
background-image:url(../images/bg-contact.png);
}
フェードインおよびフェードアウト ボタンを定義するための JavaScript。
$(document).ready(function() {
$("a.watchBtn").click(function() {
$("#about").fadeOut();
$("#filmmakers").fadeOut();
$("#press").fadeOut();
$("#contact").fadeOut();
$("#inkguy").fadeOut();
$("#paperguy").fadeOut();
$("#centertext").fadeOut();
$("#watch").fadeIn();
});
$("a.aboutBtn").click(function() {
$("#watch").fadeOut();
$("#filmmakers").fadeOut();
$("#press").fadeOut();
$("#contact").fadeOut();
$("#inkguy").fadeOut();
$("#paperguy").fadeOut();
$("#centertext").fadeOut();
$("#about").fadeIn();
});
$("a.filmmakersBtn").click(function() {
$("#watch").fadeOut();
$("#about").fadeOut();
$("#press").fadeOut();
$("#contact").fadeOut();
$("#inkguy").fadeOut();
$("#paperguy").fadeOut();
$("#centertext").fadeOut();
$("#filmmakers").fadeIn();
});
$("a.pressBtn").click(function() {
$("#watch").fadeOut();
$("#about").fadeOut();
$("#filmmakers").fadeOut();
$("#contact").fadeOut();
$("#inkguy").fadeOut();
$("#paperguy").fadeOut();
$("#centertext").fadeOut();
$("#press").fadeIn();
});
$("a.contactBtn").click(function() {
$("#watch").fadeOut();
$("#about").fadeOut();
$("#filmmakers").fadeOut();
$("#press").fadeOut();
$("#inkguy").fadeOut();
$("#paperguy").fadeOut();
$("#centertext").fadeOut();
$("#contact").fadeIn();
});
});
誰かがこの問題を再現できる場合は、私に知らせてください。ページを更新してボタンをクリックするだけで、私の側では機能しません。キャッシュをクリアしてローカルでテストした後でも、サイトでこの問題が発生しています。Dreamweaver では、まったく問題なく動作します。もう1つの奇妙な点は、divの要素が適切にロードされることです-タグ付きのpngファイルであるリンクボタンなど...したがって、divがフェードインしていることはわかっていますが、背景はありません!
本当にありがとう！