How to make Popular Post Box By Moving The Slider

Assalammu'alaikum Wr.Wb | Tidak Bosan Kami Kali ini TB4all Akan Memberitahu Tutorial Yang Berbeda Tapi Kali Ini Kami Akan Mencoba Dengan Bahasa Inggris Eheheheh ... So Soan Inggris .. Yaitu How to make Popular Post Box By Moving The Slider. Kita Langsung Saja Ke Tutorialnya Ok :D.

Here's how:

1. Login to Blogger account buddy.
2. Go To The Design
3. Then Create a New Gadget.
4. Then Put It Into Script Under New Gadgets Made Earlier!

<style>
* {
 margin: 0;
 padding: 0;
}

body {
    font: 11px Helvetica, Arial, sans-serif;
}

#wrapper {
    width: 800px;
    margin: 60px auto;
}

#intro {
    padding-bottom: 10px;
}

#slider {
    width: 800px;
    margin: 0 auto;
    position: relative;
 border: 10px solid #ccc;
}

.scroll {
 overflow: hidden;
 width: 800px;
    margin: 0 auto;
    position: relative;
}

.scrollContainer {
 position: relative;
}

.scrollContainer div.panel {
    padding: 10px;
    width: 274px;
 height: 318px;
}

#left-shadow {
 position: absolute;
 top: 0;
 left: 0;
 width: 12px;
 bottom: 0;
 background: url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/leftshadow.png) repeat-y;
}

#right-shadow {
 position: absolute;
 top: 0;
 right: 0;
 width: 12px;
 bottom: 0;
 background: url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/rightshadow.png) repeat-y;
}

.inside {
 padding: 10px;
 border: 1px solid #999;
}

.inside img {
 display: block;
 border: 1px solid #666;
 margin: 0 0 10px 0;
 width: 250px;
}

.inside h2 {
 font-weight: normal;
 color: #111;
 font-size: 16px;
 margin: 0 0 8px 0;
}

.inside p {
 font-size: 11px;
 color: #ccc;
}

a {
 color: #999;
 text-decoration: none;
 border-bottom: 1px dotted #ccc;
}

a:hover {
 border-bottom: 1px solid #999;
}

.scrollButtons {
    position: absolute;
    top: 127px;
    cursor: pointer;
}

.scrollButtons.left {
    left: -45px;
}

.scrollButtons.right {
    right: -45px;
}

.hide {
    display: none;
}

</style>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
 <script src="http://accordion-template.googlecode.com/svn/trunk/slidermovingbox.js" type="text/javascript" charset="utf-8"></script>

5. Then the Save Template Buddy and see what happens: D\
6. If you have already jQuery in your Template please delete from my script

Thank You It's Been and Read Article We, Hopefully Helpful and Good luck ^ _ ^

Haduh Kayaknya Bahasa Inggrisnya Gk Nyambung egheehe Sobalnya Pake Google Translate ^_^ Piss

Translate To English With : Google Translate