logo标签列表

动态更改网站图标

javascripthtml
4

这个网站 不知何故能够在其选项卡图标上显示购物车中商品的数量。

counter in favicon

（在任何产品上点击“加入购物车”）

它是如何操作的？

2
我并没有看到这个。但是你可以“交换”favIcon。 - Markus Zeller
1
是的，我确认了，这正是他们所做的。他们在rel="shortcut icon"链接中使用base64图像。 - Alon Eitan
1
@AlonEitan，base64 图片是自动生成的吗？它是一个 gif，重新加载时可以看到动画。 - nhaht
1个回答
3
这个网站使用base64图像作为网站图标，就像这样。
<link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACf0lEQVQ4T2WTu09UURDGf3POXS67d1l87GJMhFCIWqpIgYrFhkpsjIWxIDFCfBX2FGpjBDoTGlGJhYk2/gGa0IiVGmOM/gMk+IB1WYFlcdm995hzboBdneY8Zr7vfHNmRgDM9Alj10aLBIwxaATEHZzb3ltTRpBrH0QawRZgTUS2AyUy7rxljQQ2vokgfkHcy1sg5STuCLR+67PE/xE4MB42PBKFMhFiai4NlxLK+e1eRSEiDQos2IJq+ERigwRtDC1RFaHuwKFoqtLiFGgTok0dMY/6jH0yxFATnyjIkcodAJ1ivbSEWV0gEW4SikfdS5Pp7MHYFNYLrC59t3/QZ2J5HhteQC3Txe4zZyGZhcVv/Hj7En++QOVTgdb2HH7/SYJzp1GLX1n88r6ZoKJTFFWO7vwF2HeEqLDE/PkrZK/fpm1kBDY3KU1OsjbzkODmAPWO2lYVhAhFVSUp6120H+6n5dgQPy/ewqxDdmqK0sQEiZ4egqEhFnp7kVSC9rsnd8oYAqG08kcHlIMusp15Fk5damqu3JMneN3d/BgcdPf+0SxSn+41SilX11ASVJXPss4SfE5QevBim2D/7CzJgQGXQunOHXev9/pI9LjPRFEU11p51I3HSmIP9bkqG09fNylI5vPb6ZSfPUMltS3j8bjNjIq7UHxWdRvL7yrI9BvSw8PsHR+nODbmwrb2lqD1UCYmcC2Jjgnw+KNSLG9mMPfmqH8vYnN3VQDWZmYojI66fe7GwfgTLYFRdmBsQyhqymdDtaGXfIr3XxGtVf4dVoL+LPsud1tEPM6WwE2jsUo8arRS1mlWfnuY5x9R879QlSpeZ5r2fAfpYxn01Q/yFy5wJeuF28oDAAAAAElFTkSuQmCC" type="image/png">

你可以使用favico.js实现动态购物车徽标在网站图标上。 演示 本网站使用WooCommerce作为购物车功能，您可以参考以下插件，根据购物车中的商品数量添加动态网站图标生成。 Woocomerce Favicon Cart Badge
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接