Favicon.ico竟然会动,原来是.gif在做怪

 dothinkingmaster   2013-02-15 17:42   4646 人阅读  4 条评论

 今天在修改网站 浏览器地址栏显示小图标favicon.ico样式时,无意中到了pjhome.net(pjblog的官方网站)的首页,发现它的favicon.ico图标会动,太神奇了,赶紧搜索一下,发现.ico文件是一种不常用的图片格式,一般用做程序文件图标和网站地址栏显示标识来使用,比如我们打开QQ的安装文件会有一只漂亮的小企鹅,我们打开常用的google.com在地址栏的最左侧会发现一个小标识,还有打开我们的收藏夹会发现被收藏网页的最前面也会有个小标识。但最重要的是它并不会动,那么会动的Favicon.ico是怎么实现的呢,移形换位?

image

我们知道一般用来显示网站标识的代码是<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />,首先你需要制作一个.ico格式的小图片,一般我选择先在photoshop里面做一张等比例的.jpg图片,然后使用在线制作.ico图标的网站来把.jpg的图片处理成.ico格式的,当然也有专门的软件大家可以搜索一下。

但是使用以上的代码只能显示静态的Favicon.ico,会动的,首先我们想到的图片格式是.gif,那么会不会是一种显示时的替换呢,继续扒拉它的代码,发现还有一行<link rel="shortcut icon" href="/icons/pjhome_logo_gif.gif" type="image/gif" />,赶紧再制作一张等比例的.gif图片格式,当然记得要做成动画版的。两行代码合并,预览网页,haha,会动的favicon.ico搞定,事情就是这么简单。

在线制作ICO  http://www.bitbug.net/

本文地址:http://dothinking.cn/tui-jian-wang-zhan/ico-gif.html
版权声明:本文为原创文章,版权归 dothinkingmaster 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

评论列表

  1. 大豆异黄酮
    大豆异黄酮  @回复

    好玩!那这样所有的图只要自己想就可以动起来了。嘿嘿。不错

  2. 套利团
    套利团  @回复

    这个好玩,回头试试!

  3. 速游网游加速器
    速游网游加速器  @回复

    路过帮顶一下。(速游网游加速器,翻墙与加速同时进行)

  4. csdsq
    csdsq  @回复

    据说博主是MM?
    帮顶一下!