Bloggtips, ljusare bild vid mouseover
Tänkte börja på en ny kategori. Bloggdesignstips. Här får du veta hur man nu gör med alla dessa konstiga koder som man inte alls förstår sig på :P
På min blogg så har jag att det blir ljusare bilder när man håller muspekaren på de.
Gå först in på desig och sedan på kodmallar. Sen klistrar du in den här koden efter första <head>
Jag har kopieringsskydd på min blogg men det ni kan göra är att markera allt och sedan trycka ner Ctrl och C för att kopiera.
<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>
Sen om ni vill att det inte ska bli så mkt ljusare ändrar du talet 0,7 till ett högre t.ex 0,8 eller 0,9 sen om du vill ha den ljusar så ändrar du det till ett mindre tal.
Hoppas att ni förstår, är ganska dålig på att förklara :P
På min blogg så har jag att det blir ljusare bilder när man håller muspekaren på de.
Gå först in på desig och sedan på kodmallar. Sen klistrar du in den här koden efter första <head>
Jag har kopieringsskydd på min blogg men det ni kan göra är att markera allt och sedan trycka ner Ctrl och C för att kopiera.
<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>
Sen om ni vill att det inte ska bli så mkt ljusare ändrar du talet 0,7 till ett högre t.ex 0,8 eller 0,9 sen om du vill ha den ljusar så ändrar du det till ett mindre tal.
Hoppas att ni förstår, är ganska dålig på att förklara :P