How To Make A Picture Spin On The Popular Posts Widgets

Share it:
How to Make a Picture Spin on the Popular Posts Widgets. The image on the Widget Popular Posts has the effect of rotating, will enhance the look of your Blog. When the cursor pour your image in the widget popular posts, the image will be rotating. Hopefully this can reduce the saturation on the look of your Blog. Indeed the display on the blog not too overlooked. Important that neatness, content-quality content, and good SEO. But there is no harm to enhance the look of your blog. As long as it does not install a widget that is not necessary and even burdensome your Blog when loaded.

Ok, if you want to create an image on the widget popular posts rotating, here's the steps:



 

  • Go to your blogger Dashboard  > Template > Edit HTML
  • Click anywhere inside the template editor and press Ctrl + F and search </head>  tag
  • Paste the following code snippets just before the </head>  tag
<style type='text/css'>
.PopularPosts .item-title{
  display: none;
}
.PopularPosts ul li {
  background: none repeat scroll 0 0 transparent;
  float: left;
  list-style: none outside none;
  margin: 5px !important;
  padding: 0 !important;
}
.PopularPosts ul li img {
  padding:0;-moz-border-radius: 5px;
  border-radius: 5px;
  transition: all 0.3s ease;
  border: 2px solid #CCC;
  height: 80px;width: 80px;
 }
.PopularPosts ul li img:hover {
  border:2px solid #BBB;
  -moz-transform: scale(1.2) rotate(-1090deg);
  -webkit-transform: scale(1.2) rotate(-1090deg);
  -o-transform: scale(1.2) rotate(-1090deg);
  -ms-transform: scale(1.2) rotate(-1090deg);
  transform: scale(1.2) rotate(-1090deg);
}
</style>
Last click save and finish, please see the result.
Share it:

Post A Comment: