Animated loading Effect on Sidebar for Blogger
Firstly go to Blog Title → Template → Edit HTML. Press Ctrl + F. Expand <b:skin>....</b:skin> if it is not expanded. Type ]]></b:skin> in search box and press enter key. [As per the new HTML editor]
Add the below given code just below ]]></b:skin>
<style> @-webkit-keyframes transform-translate{ from{-webkit-transform:translate(0px,1000px)} to{-webkit-transform:translate(0px,0px)} } @-moz-keyframes transform-translate{ from{-moz-transform:translate(0px,1000px)} to{-moz-transform:translate(0px,0px)} } @-ms-keyframes transform-translate{ from{-ms-transform:translate(0px,1000px)} to{-ms-transform:translate(0px,0px)} } @-o-keyframes transform-translate{ from{-o-transform:translate(0px,1000px)} to{-o-transform:translate(0px,0px)} } @keyframes transform-translate{ from{transform:translate(0px,1000px)} to{transform:translate(0px,0px)} } .sidebar { -webkit-animation:transform-translate 4s; -moz-animation:transform-translate 4s; -ms-animation:transform-translate 4s; -o-animation:transform-translate 4s; animation:transform-translate 4s; } </style>
Blogger Comment