Auto Scrolling Recent Posts Widget for Blogspot

How to Install Auto Scrolling Recent Posts Widget.

Adding The Widget To Blogger.  Go to Blogger >> template.

Step 1 Copy the following code and paste anywhere below </head> tag (script)

 <div class='head_brnews'>  
  <div class='breaking-news'>   
   <div class='samazhlo'>  
    Latest Post  
   </div>  
   <script src='https://dl.dropboxusercontent.com/u/80436322/autoscroll.js' type='text/javascript'/>  
   <script type='text/javascript'>  
    var nMaxPosts =8;  
    var nWidth = 100;  
    var nScrollDelay = 120;  
    var sDirection = &quot;left&quot;;  
    var sOpenLinkLocation = &quot;N&quot;;  
    var sBulletChar = &quot;&gt;&gt;&quot;;  
   </script>  
   <script src='/feeds/posts/default?alt=json-in-script&amp;callback=RecentPostsScrollerv2&amp;max-results=6' type='text/javascript'/>  
  </div>  
   </div>  

Step 2 Copy the following code and paste inside an Template (CSS)

 .head_brnews{  
       height:30px;  
       background:#fff;  
       width:100%;  
       max-width:1160px;  
       margin:15px auto;  
       border-style: solid ;  
       border-width: 1px;  
       border-color: #0080ff;  
       overflow: hidden;  
       width: 955px;  
       margin-top:15px;  
 }  
 .breaking-news{  
        float:left;  
        height:30px;  
        position:relative;  
        overflow:hidden;  
        margin-bottom:20px;  
 }  
 .breaking-news {  
         background: #fff;  
         display:block;  
         float:left;  
         padding:0 10px;  
         height:32px;  
         line-height:30px;  
         color:#000;  
         font-family: Oswald,arial,Georgia,serif;  
         text-transform:uppercase;  
         font-size:15px;  
         margin-right:10px  
 }  
 .breaking-news ul{  
          float:left  
 }  
 .breaking-news a:hover{  
            color:#333;  
 }  
 .breaking-news ul li{  
           float:left;  
           display:block;  
           list-style:none;  
 }  
 .breaking-news ul a{  
           padding:1px;  
           display:block;  
           color:#333;  
           white-space:nowrap;  
           float:left;  
           line-height:30px;  
           font-size:15px;  
           font-family: 'Droid Serif', serif;  
           display:hidden;  
 }  
 .breaking-news span{  
          display:block;  
          float:left;  
          padding:1px 10px;  
          color:#333;  
          font-size:15px;  
          line-height:30px;  
 }  
 .samazhlo{  
      background:#4371CF;  
      position:absolute;  
      left:0;  
      padding: 0 20px;  
      height: 32px;  
      line-height: 30px;  
      color: #FFF;  
      font-family: 'Yanone Kaffeesatz', sans-serif;  
      text-transform: uppercase;  
      font-size: 20px;  
      margin-right: 10px;  
 }