<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<!-- Javascript div#slide-holder -->
<script type='text/javascript'>var _siteRoot='index.html',_root='index.html';</script>
<script src='http://blogspot-choen.googlecode.com/files/scriptsSlider.js' type='text/javascript'/>
<script type='text/javascript'>
if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"Code-code-an","desc":"Media Dokumentasi Tutorial dan Desain "},
{"id":"slide-img-2","client":"sIFR 02","desc":"Free Blogger Template"},
{"id":"slide-img-3","client":"Bukan Coklat ","desc":"Free Blogger Template"},
{"id":"slide-img-4","client":"Ini Minimaliskah ?","desc":"Free Blogger Template"},
{"id":"slide-img-5","client":"Cufon","desc":"Free Blogger Template"},
{"id":"slide-img-6","client":"jQuery 2","desc":"Free Blogger Template"},
{"id":"slide-img-7","client":"jQuery 1","desc":"Free Blogger Template"}];
</script>
#headerSlider {
display: inline;
float: left;
margin: 0 10px;
}
div#headerSlider div.wrapSlider {
background: none repeat scroll 0 0 #000000;
border: 4px solid #333333;
border-radius: 3px 3px 3px 3px;
margin: 0 auto;
min-height: 316px;
min-width: 461px;
width: 100%;
}
div#headerSlider div#slide-holder {
height: 288px;
position: absolute;
z-index: 40;
}
div#headerSlider div#slide-holder div#slide-runner {
height: 307px;
left: 5px;
overflow: hidden;
position: absolute;
top: 5px;
width: 460px;
}
div#headerSlider div#slide-holder img {
display: none;
margin: 0;
position: absolute;
}
div#headerSlider div#slide-holder div#slide-controls {
display: none;
height: 46px;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
div#headerSlider div#slide-holder div#slide-controls p.text {
color: #FFFFFF;
display: inline;
float: left;
font-size: 10px;
line-height: 16px;
margin: 15px 0 0 20px;
text-transform: uppercase;
}
div#headerSlider div#slide-holder div#slide-controls p#slide-nav {
display: inline;
float: right;
height: 24px;
margin: 11px 15px 0 0;
}
div#headerSlider div#slide-holder div#slide-controls p#slide-nav a {
background-position: 0 0;
background-repeat: no-repeat;
color: #CCCCCC;
display: inline;
float: left;
font-size: 11px;
font-weight: bold;
height: 24px;
line-height: 24px;
margin: 0 5px 0 0;
text-align: center;
text-decoration: none;
width: 24px;
}
div#headerSlider div#slide-holder div#slide-controls p#slide-nav a.on {
background-position: 0 -24px;
}
div#headerSlider div#slide-holder div#slide-controls p#slide-nav a {
background-image: url("http://lh6.ggpht.com/_dfnTVAxeWMI/SpPogDg6qzI/AAAAAAAACKU/DhQZk2y7GtE/s800/silde-navSlider.png");
}
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!--HTML div#slide-holder-->
<div id='headerSlider'><div class='wrapSlider'>
<div id='slide-holder'>
<div id='slide-runner'>
<img alt='code-code-an' class='slide' id='slide-img-1' src='http://imageshack.us/a/img4/9130/img4749br.jpg'/>
<img alt='sIFR in Blogger Template' class='slide' id='slide-img-2' src='http://i.imgur.com/Qx81s3d.jpg'/>
<img alt='Free Blogger Template' class='slide' id='slide-img-3' src='http://imageshack.us/a/img13/1649/img4759ga.jpg'/>
<img alt='Free Blogger Template' class='slide' id='slide-img-4' src=''/>
<img alt='Free Blogger Template' class='slide' id='slide-img-5' src=''/>
<div id='slide-controls'>
<p id='slide-nav'/>
</div>
</div>
<!--content featured gallery here -->
</div>
</div></div>
<!-- End HTML div#slide-holder -->
</b:if>
You Might Also Like :