SLIDE SHOW HTML CODE FOR BLOGGER OR WEBSITE

HIGH-QUALITY SLIDE DISPLAY ON BLOGGER HTML CODE Add a high-quality slide show on your blogger Html code below. Easy to paste this code ...

HIGH-QUALITY SLIDE DISPLAY ON BLOGGER HTML CODE

Add a high-quality slide show on your blogger Html code below. Easy to paste this code ad a gadgets place on your sidebar or the top of your post. And replace images on this code 'yellow' highlight. Add title and description.

SLIDE SHOW HTML CODE COPY AND PASTE THIS CODE ON YOUR BLOG OR WEBSITE

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://s3slider-original.googlecode.com/svn/trunk/s3Slider.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {
   $('#btrix_slider3').s3Slider({
      timeOut: 3000
   });
});
</script>
<style>
#btrix_slider3 {
   width: 590px; /* Keep it 20px-40PX greater than ACTUAL Image size */
   height: 430px;
   position: relative;
   overflow: hidden;
   margin-left: 0;
}
#btrix_slider3Content {
   width: 590px;
   position: absolute;
   top: 0;
   margin-left: 0;
}
.btrix_slider3Image {
   float: left;
   position: relative;
   display: none;  top: 0;
   border:1px solid #ddd;
}
.btrix_slider3Image span {
position: absolute;
    font: 10px/15px sans-serif,Arial, Helvetica;
    padding: 10px 10px;
    background-color: #000;
    color: #fff;
    filter:'alpha(opacity=70)';
    -moz-opacity: .5;
    -khtml-opacity: .5;
    opacity: .5;
    text-align:justify;
}
.btrix_slider3Image span a {
text-decoration:underline;
color:#FE6602;
}
.clear {
   clear: both;
}
.top {
    top: 0;
    left: 0;
    width: 570px !important;
    height: 70px;
}
.bottom {
    bottom: 0;
    left: 0;
    width: 570px !important;
    height:90px;
}
.left {
    left: 0;
    top: 0;
    width: 110px !important;
    height: 335px;
}
.right {
    right: 0;
    bottom: 0;
    width: 80px !important;
    height: 319px;
}
</style>

<br />
<div id="btrix_slider3">
<ul id="btrix_slider3Content">
<li class="btrix_slider3Image">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoZI2s0bOFsrrDJMvOUM0-1NKKD-HQ1nJ4Q7W7m5rVNgvPCMKIDzlgnL-ABC7a2Gw-LYzg2AFk8Ggdqyv6Hg5wQ81qlUsp8fmUhhQAZEEVQyo1Rx_rvpWapP-bsR1xioRAb9B-3IA1kpyD/s1600/mokshame.jpg" />
<span class="left"><h3>
TITTLE </h3>
DESCRIPTION</span>
</li>
<li class="btrix_slider3Image">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVsUHkb3CxDgYNvXSlRqk7Oep81TpLeoCMEBO6ITEJ-Mtb9AfN9e3N6Gi3e3m6FLmDCizqDGXT0RwlQktr5ERa9lyL_4oac_iljRG_ZZeIBG6XD2ZVoYG1yRkrx6zZIIklNecSNZUeU566/s1600/esoyum.jpg" />
<span class="left"><h3>
TITTLE </h3>
DESCRIPTION</span>
</li>
<li class="btrix_slider3Image">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUL4XhFs1tU7vu_E-4hZb3eZdvNMUnS5xESK6LFbC_FQG2EwvyyqngLQvPcIxo1t8E5Jj3aC5MCwL7MnCBo96WLpJYhyphenhyphenjleFTdcKZkCF-3gu25j7eQnmIJ-B_DIw8JFFlcIAx4hFRfnNWU/s1600/PULARKALA.jpg" />
<span class="top"><h3>
TITTLE </h3>
DESCRIPTION</span>
</li>
<li class="btrix_slider3Image">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGKV_LCwnmeUzSmRtzOh_LIwLUbLn6c7vviZDp9Bn7XzuKzWZT302eTvD6tT0JaVWFkvjeT5EYcmynAD45x04J19tm_DAY4C6w5GbvQ9ZS1jHWZl0IMj_JMuACRUcBRWM8dbB7Be72FjKa/s1600/NALLIDA.jpg" />
<span class="bottom"><h3>
TITTLE</h3>
DESCRIPTION</span>
</li>
<li class="btrix_slider3Image">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW5fdhC0nfxJEKOVSxa75r8nVBWNmKF48J0U-qkduao3aKJRSWOyjGGX5lzuh2Uv4PCbwlWVdnFckNdiKS3LhJQUz1yT6augUCxsd7CzICTWDL-MCudLucHHPPgkaOWOcOyYLpQfmUy_pQ/s1600/SWARGA.jpg" />
<span class="bottom"><h3>
TITTLE </h3>
DESCRIPTION</span>
</li>
<div class="clear btrix_slider3Image">
</div>
</ul>
</div>