Designtips: Vit-tonad bild vid mouseover
Fått lite frågor om hur jag får den vita toningen på mina bilder i inläggen, så nu tänkte jag förklara :)
Det enda jag har gjort är att lägga in en kod i kodmallen, eftersom jag har en vit bakgrund i mina inlägg så blir det en vit toning, annars blir bilderna egentligen genomskinliga.
1. Gå in i kodmallen och lägg den här koden mellan <head> och </head>.
<style type="text/css">
img{opacity: 1;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;}
img:hover{opacity: 0.6;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;}
</style>
2. För att ändra hur genomskinlig du vill att bilden ska bli ändrar du img:hover{opacity: 0.6; från 0,1-1,0 beroende på hur mycket du vill att det ska vara. Sen lägger du bara in koden i varje kodmall så det syns överallt på bloggen :)