0

1 つの Web サイトと 2 つのドメイン名があります。訪問者が www.SampleSiteA.com のページに移動した場合は画像 "A" を表示したいのですが、www.SampleSiteB.com のページに移動した場合は画像 "B" を表示する必要があります。

残念ながら、以下のコードの結果は空白で、画像がまったく表示されません。何か案は？

ファイルの内容:welcome.html

<html>
<head>
     <script src="resources/js/domain.js" type="text/javascript"></script>
</head>
<body>
     <div class="welcomepic"></div>
</body>
</html>

ファイルの内容: styles.css

.picForA{
    background-image: url('../img/A.png');
}
.picForB{
    background-image: url('../img/B.png');
}
.welcomepic{
    background-position:left center;
    background-repeat: no-repeat;
    padding-left:160px;
    width:225px;
    float:left;
    height:100px;
    display: block;
}

ファイルの内容: domain.js

function welcomepic() {
    if (location.hostname == 'www.SampleSiteA.com') {
        $('.welcomepic').addClass('picForA');
    } else {
        $('.welcomepic').addClass('picForB');
    }
}
4

1 に答える 1

2

関数を呼び出しません。解決策は、次のコードを html の先頭に追加することです。

$( document ).ready(function() {
welcomepic();
});

また、welcompic 関数で前のセット クラスを削除する必要があります。そうしないと、ダブル クラスになってしまいます。

function welcomepic() {
    if (location.hostname == 'www.SampleSiteA.com') {
        $('.welcomepic').removeClass('picForB').addClass('picForA');
    } else {
        $('.welcomepic').removeClass('picForA').addClass('picForB');
    }
}
于 2013-09-18T22:19:04.023 に答える