Blogspot için Küçük resim ile jQuery Slider (Tek kodlu)

• DEMO1
• Demo2

"Blogger bloğunuza CSS3 görüntü slayt" eklemek için aşağıdaki adımları takip edin.

1. Bloggere git Yerleşim'e tıkla
2. Bir ekleme HTML / Javascript Gadget açın
3. Aşağıdaki kodu kopyalayın ve yapıştırın.

<style type="text/css">
.slider-box {
    background: none repeat scroll 0 0 #FAFAFA;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 0 3px #333333;
    margin: 0 auto;
    width: 675px;
 overflow: hidden;
}
#slider-wrapper {
    margin: 0 auto;
    padding: 10px;
}
#jslider-container {
    border: 2px solid #FFFFFF;
    max-width: 550px;
    position: relative;
    text-align: left;
    z-index: 90;
}
</style>
<link href="http://project.dimpost.com/image-slider/wowslider/css/wow-slider.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<div class="slider-box">
<div id="slider-wrapper">
<div id="jslider-container">
 <div class="jslider_images">
      <ul>
  <li><a href="http://dimpost.com">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn3qUAbof67LH-CLDFHeJIcfg6-E6HH-W5Av8m1XYkfnDlJBKxssD-8hFpQ_Y6fT4LQpOn0Eeo5O4zw6_eK9ZCUKWaLz-OPtuLdio7BopaMJp3oSf0EtQP4Dj2v9ohwJkI-vdY9IB7IOmv/s550/sample1.jpg" title="Sunset"/>
  </a>A boat with beautiful sunset.</li>
  <li><a href="#">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN92ZzLDtEuE7EWlt3uiQZAhpP1aZOtKBOzKPg8o4h_Zy_cwuTg7dc5qehQCL9PsVdBT737xfGU4X8vExpE5Yh13MWGCQPF5-QcNAsLyAMZzd7N6r3CzvTJnWHjWMeeQp7as5TXFsBgDk5/s550/sample2.jpg" title="Rainbow"/>
  </a></li>
  <li><a href="#">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5KSJ0oRrZ2k8HAgRYxi-VuqLqCkzqoA_Xh3hxn5Jy5W-wHe-uOhgQydHcnfkndKDzmoJWczbH_ZKe_uNCPZttODgLRj1QtSBAT_aMwWiOhLI9IZtfHudrbVRO_4PnhlqqCDG8qgUJnmMM/s550/sample3.jpg" title="True Nature"/>
  </a>Tree in field with blue sky.</li>
  <li><a href="#">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSvOuSaegtrrEa7gmYvXLgKL6TSo9PFUHooVxClxtgzwgEjFTOq1v_I2xBbaLlmpT4mTnu9cBihGnAIpWXfwJ1gn61MPEPJFZMWwaEd5YgZfJfLej2GlKX5NxcuZaXomj166_-wfgKIFrb/s550/sample4.jpg" title="Sunrise""/>
  </a>Amaizing sunrise moment</li>
  <li><a href="#">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNO-sE2YPW2eCdsSltqzKXCgbN0lAWUVncV7E7D0cNzD0tVlWsthZHJQ5RF4TvAMxsKFkzIL8Hykw5KJq9C8Y-iq13yCxQufVx862fea9FyVSFpZfnZBSHam3wW0fypCK9B1JT0aA9z9ae/s550/sample5.jpg" title="CAR in HDR Nature"/>
  </a></li>
  <li><a href="#">
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu2JzodLuNUEkFvHRyeLQP3PqZLLvr4HvFOH2pb4iuJBvCjO5n1XDtdgimhekh6OfFbqtJzwrfkOLBCf-74F-PpfGWd1jNlP9V9eMqO3ikENFq8vLrJ4xgVUkxaNzJKzvaxj_JQM4y4tRW/s550/sample6.jpg" title="Sunshine"/>
  </a></li>
   </ul>
    </div> 
    
 <div class="jslider_thumbs">
        <div>
  <a href="#" title="Sunset"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga6HTu1nugdcHCcwFDUvNKlDryqbAxcyRj-27SzhhpSrcGeR4WcKKd-QrKMtLRJMsWBuC26S0NcYVzLx7x_srTgCcu5t9Kvc4zVikp2l-l_vAAPKOB48oFp_46dIVX7CWh_yEZpgMDezup/s85/sample1.jpg"/></a>
  <a href="#" title="Rainbow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDm5yPVsOfTdj9mMtpBMoI9gi_pEvs_fyroeFUVYWA-MaEMJUGsiMmuRfTZUDzQl95hQ4qnmPaoftTxX1xra92qKAqX99cS6qjW99_JXJ1nfdA9xGmzo74dyylSt8uSoVkTqa9qmgxK5PU/s85/sample2.jpg"/></a>
  <a href="#" title="True Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUJbWmHkc0LlJMjtTEL-LmdO8mety4ZOfEXP0vO5UXKoniRDYg6S9gDpX-5pTVN1nodbN-4YPs6JM4ChxqAoYwH63dWWwz_pzTDCmu9i6rFOUHtFIh4VrXvDhgcwape1J0uNflmyBXwEbI/s85/sample3.jpg"/></a>
  <a href="#" title="Sunrise"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpSOhkz4fT0b6xRubI0V5vj7Iktypsyz80c6J__bwuP5iWKELnfmakf59G6VtkoeXAzZgpSZII_DUwBmlXogma8e1Gk5VoKsbFDUTCV384W7lFVX9WIls9wHrsugwvE-pjtNhAjaMjFnVr/s85/sample4.jpg"/></a>
  <a href="#" title="CAR in HDR Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1Xf-KF2yIut1KnQuInggWf2QWLdc36pJrgLp_C3tLH2DmgJQYkW7ixV-TG8TnfSn0Jyak-TOb_j-7QHoRQXX-CSMJo8Yyox2j8pSR5OHoH1OzJETciLLmFxyN2Qo_XVqugB3Npfppzk3s/s85/sample5.jpg"/></a>
  <a href="#" title="Sunshine"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0m8FqQWSQJ9oX3h-PDyz9n-gzRueIpW4QwOL_hKWQlam-9Xe6SRFv3DDbAFOnIokbj0lDi3P1E-apqpJf7QU81Zdb4JekDKp0WvYenZrdfVhB3SWtE-tyhTkLmVAh7oYhZkzlmcJAkkRn/s85/sample6.jpg"/></a>
        </div>
 </div>
    
</div>
</div>
</div>
<script type="text/javascript" src="http://dimpost.googlecode.com/files/wow-slider.js"></script>

• A boat with beautiful sunset.
• 
• Tree in field with blue sky.
• Amaizing sunrise moment
• 
•