Message or Notification Scroll Out For Blogger

This is an amazing message scroll out for blogger. This widget can be added to any to any blog  for some notification or any important message. This widget is made by me and has a simple css hover effect in it.

Steps To Add Message Scroll Out To Blogger

• Login to your Dashboard.
• Go to Templates >>Edit Html.
• Find for ]]></b:skin> tag.
• Paste the below code before  ]]></b:skin> tag.

.message-slide-out-by-blog-toolz {
    position:fixed;
    z-index:9999;
    text-decoration:none !important;
    color:white !important;
    background-color:rgba(34, 34, 34, 0.64);
    padding:10px;
    font-family:'verdana';
    font-size:13px;
    border-radius:0px 5px 5px 0px;
    top:10px;
    left:-180px;
    -webkit-transition:all 0.4s ease-in-out;
    -moz-transition:all 0.4s ease-in-out;
    -ms-transition:all 0.4s ease-in-out;
    -o-transition:all 0.4s ease-in-out;
    font-weight:bold;
    padding-left:35px;
}
.message-slide-out-by-blog-toolz:hover {left:0px;}

• Now,click on Save the Template.
• Now,go to Layout.
• Click on Add a Gadget >>Html/Javascript.
• Paste below code the there.

<a class='message-slide-out-by-blog-toolz' href='http://blog-toolz.blogspot.in/2012/07/css-bullet-style-hover-effect-for.html' target='_blank'>Colour Changing Bullet Style</a>

Note: Change the red link with your link and green text with your display text.

• Now,click on Save.

It's Done.

Categories: Blogger Widgets , CSS