更改标志的标签

时间:2016-06-14 16:38:32

标签: javascript css

现在我只有一些带有标签的glyphicon,但我想做的是将其更改为标志?如果我想使用.jpeg图像而不是glyphicon,我怎么能这样做?

$(document).ready(function () {
if ((window.location.href.indexOf("lang=en") > 0)) {
    $("#language").html("<span class='glyphicon glyphicon-globe' aria-hidden='true'></span> spanish");
    $("#language").attr("href", "")

}
else {
    $("#language").html("<span class='glyphicon glyphicon-globe' aria-hidden='true'></span> ENGLISH SITE"); 
}

$("#language").click(function (event) {
    event.preventDefault();
    var hash = location.hash;
    console.log(hash);
    var strloc = location.href.replace(hash, "");
    if ((strloc.indexOf("?lang=en") > 0)) {
        strloc = strloc.replace("?lang=en", "?lang=es")

    }
    else {
        if ((strloc.indexOf("?lang=es") > 0))
            strloc = strloc.replace("?lang=es", "?lang=en");
        else
            strloc = strloc + "?lang=en";
    }
    location.assign(strloc + hash);
});

});

1 个答案:

答案 0 :(得分:0)

您可以在<span>元素上使用背景图片。例如:

&#13;
&#13;
.flag {
    width: 16px;
    height: 11px;
    background:url(http://i.stack.imgur.com/7ndjR.png) no-repeat;
    display: inline-block;
}

.flag.flag-ad {background-position: -16px 0}
.flag.flag-ae {background-position: -32px 0}
.flag.flag-af {background-position: -48px 0}
.flag.flag-al {background-position: -64px 0}
.flag.flag-am {background-position: -80px 0}
.flag.flag-ao {background-position: -96px 0}
.flag.flag-as {background-position: -112px 0}
.flag.flag-at {background-position: -128px 0}
.flag.flag-au {background-position: -144px 0}
.flag.flag-az {background-position: -160px 0}
.flag.flag-ba {background-position: -176px 0}
.flag.flag-bd {background-position: -192px 0}
.flag.flag-be {background-position: -208px 0}
.flag.flag-bf {background-position: -224px 0}
.flag.flag-bg {background-position: 0 -11px}
&#13;
<ul>
    <li><a href="#"><span class="flag flag-ad"></span> Andorra</a></li>
    <li><a href="#"><span class="flag flag-ae"></span> United Arab Emirates</a></li>
    <li><a href="#"><span class="flag flag-af"></span> Afghanistan</a></li>
    <li><a href="#"><span class="flag flag-al"></span> Albania</a></li>
    <li><a href="#"><span class="flag flag-am"></span> Armenia</a></li>
    <li><a href="#"><span class="flag flag-ao"></span> Angola</a></li>
    <li><a href="#"><span class="flag flag-as"></span> American Samoa</a></li>
    <li><a href="#"><span class="flag flag-at"></span> Austria</a></li>
    <li><a href="#"><span class="flag flag-au"></span> Australia</a></li>
    <li><a href="#"><span class="flag flag-az"></span> Azerbaijan</a></li>
    <li><a href="#"><span class="flag flag-ba"></span> Bosnia and Herzegovina</a></li>
    <li><a href="#"><span class="flag flag-bd"></span> Bangladesh</a></li>
    <li><a href="#"><span class="flag flag-be"></span> Belgium</a></li>
    <li><a href="#"><span class="flag flag-bf"></span> Burkina Faso</a></li>
    <li><a href="#"><span class="flag flag-bg"></span> Bulgaria</a></li>
</ul>
&#13;
&#13;
&#13;

来源:https://www.flag-sprites.com