javascript - Comment changer l'image du sprite et la couleur de la police en cliquant sur la navigation?

Question

Comme le montre l'image, mais il y a quatre pages dans l'image. Ce que je veux faire maintenant, c'est cliquer sur l'icône et changer la couleur de la police sur une page.

Ensuite, l'icône est constituée de sprite

Ce qui suit est une capture d'écran du code, principalement pour les images Sprite

Answer 1

background-position Changez la position de l'arrière-plan et créez deux ensembles, l'un est gris et l'autre est coloré

Utilisez simplement la couleur comme police

De plus, si vous ne souhaitez pas utiliser deux séries d'images, vous pouvez utiliser un masque CSS, mais la compatibilité n'est pas très bonne

Maintenant que vous avez écrit un ensemble de classes en arrière-plan, changez simplement de classe

Answer 2

$(".sctop li").click(function(){
        $(this).addClass("hover").siblings().removeClass("hover")
        var index = $(this).index();
        $(".spp .sp1:eq("+ index +")").css("height","auto").siblings().css("height","0px");
})

Veuillez vous référer à ceci