How to make animation of Titlel logo? | Sololearn: Learn to code for FREE!
Neuer Kurs! Jeder Programmierer sollte generative KI lernen!
Kostenlose Lektion ausprobieren
0

How to make animation of Titlel logo?

web titel logo!

13th Jul 2017, 4:21 PM
Paran Boruah
Paran Boruah - avatar
8 Antworten
+ 5
@visph, .jpg, .png and .gif images are not text so cannot be used as title only the .ico can be used
14th Jul 2017, 6:12 AM
Nomeh Uchenna Gabriel
Nomeh Uchenna Gabriel - avatar
+ 4
You cannot animate the <title> (.ico) logo since its not in the document. it's in the head.
13th Jul 2017, 6:19 PM
Nomeh Uchenna Gabriel
Nomeh Uchenna Gabriel - avatar
+ 3
What kind of animation? Have you already code showing the static title/logo?
13th Jul 2017, 4:23 PM
visph
visph - avatar
+ 3
Use css 'transform' property with value 'rotate(ndeg)' value, combined with 'animation' property and '@keyframes' definition: <img id="logo" src="url" alt="description" width="50" height="50"> <style> #logo { background:red; animation-name:anim; animation-duration:10s; animation-iteration-count:infinite; animation-timing-function:linear; } @keyframes anim { from { transform:rotate(0deg); } 50% { transform:rotate(180deg); } to { transform:rotate(360deg); } } </style> background and image size are added to test the code without valid src provided... The line with 50% is unnecessary in this case, but I put it for teaching purpose: you can add how many time key to the definition ;) Anyway, you need to provide version of property with vendors prefix, to support some browsers/versions ^^
13th Jul 2017, 4:50 PM
visph
visph - avatar
+ 2
If you was talking about the <title> tag of you html document, as suggested by @Nomeh Uchenna Gabriel, and more precisely the named 'favicon' (favorite icon), you can only animate it by using an animated gif as image... my previous solution was for animating a content title logo, not the <title> tag of <head> section ;P
14th Jul 2017, 4:57 AM
visph
visph - avatar
+ 2
@Gabriel: I was talking about the favicon of a page/site, which stand left side of title tab/window wich can be the << title logo >> meaning of @Paran Boruah...
14th Jul 2017, 6:20 AM
visph
visph - avatar
0
like rotation!
13th Jul 2017, 4:26 PM
Paran Boruah
Paran Boruah - avatar
0
my title logo is png file.
13th Jul 2017, 4:27 PM
Paran Boruah
Paran Boruah - avatar