http://imagesliderforblogger.blogspot.com
http://imagesliderforblogger.blogspot.com/2013/06/jquery-image-sliderwow-slider-with.html#.UlJk-Ufbf_Y
<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/AVvXsEhDa8kd_1f4JR8kopyR50IZ3IxjhHqeaIwC0HC1gc3iDdf-P2QRg04Bjc7el2kk1E6NXfVbDCz_0eOHrwuLOmV_FjW1YuKRcA7heWYuQsZWVodyI-XqFx8MEhQcG8ucaJcUWVpPWzjKoqk4/s550/sample1.jpg" title="Sunset"/>
</a>A boat with beautiful sunset.</li>
<li><a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW0q6srdAq6Zq3AN_ML3w-1v63ZFF6lUJeHti019z_5GTJyNCskZLgu-XDJohMxCsyDatVnwyhK1WlPlIoqQbXgJ_VkyNpiwVsqon9u6Mpiw9sXnu2cDkaDz1cAkrgfFqRMGDQ_XebuSiF/s550/sample2.jpg" title="Rainbow"/>
</a></li>
<li><a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV83WPo7IQRdV2o4Eu-hgcp5z4YOAnYktHsvTcZ2WKy2yUpv9BQh-NN4yIzmASOxOmIYsXoXHq4Y3FODfsFtsn2serezoU8P1AXQJmEp0FRYZYJrGXnPKDDwfDCu8Js9rfe_CN5fUIpwT1/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/AVvXsEia_XW9PHQ-yuDzrqKG9ivMw9kRpQnPP474dfGnc_aSOUJ0Q9eRO18jwBdwsNx3-eX8c9lt7-5R1hM06_nwO-Fe3Jab-7ALh2tFEtlYrDeoJb4CVT9rI8RsJIk-X7g2lAFOZ4PmFWMUy39J/s550/sample4.jpg" title="Sunrise""/>
</a>Amaizing sunrise moment</li>
<li><a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoNO0yzfSuykaJKewpYI352xgVn4-XLD3DTgLcgkvRKdoHUsLtmiKPqNh1VlCGWnXR0TZBQ6OYGcVJ4AxQiMNklCDrVRskD4qWCs25InJnfUCwk7PDGwwxQabdNoKU2nzwAKkeQKiNoRli/s550/sample5.jpg" title="CAR in HDR Nature"/>
</a></li>
<li><a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYybHwV3w6gRh0TBsY8YBMw7QQZg4RwPzhrvTgjxRReb97idtQepZRjS351zp3mpjY7x0AwLOT5y2HDejwd37lsn35p07zEXjKc0n12KrZxwcOqMAkw5XBjCgtgRop8dpCTGVvysioOgtd/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/AVvXsEiYzeT5cO_djONcIbXoK1FYHF-wosy4y-ZwBs4KiW8HJWF23257PFAdKou6jijxDqhHu0ASurHCiaBzrI8gMVT-yvx4E5pB5hS1gIT2tP92JcOBRi0wz6BkbifWpp7DZ3e36dsvAcbUQW2o/s85/sample1.jpg"/></a>
<a href="#" title="Rainbow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6ImV8O0wFfGSBcaSKHBwkt7y2OweaXge1OMw8lj4HAEGnsxrS1iQY9cEyFxr38rtwaK0DjzGamaOAlo2QSjrrtnOml5z9gKOL_kB3XHLjbhoSOxWe2ADNe9nxt9hrc1vMx_iKsAByVLiv/s85/sample2.jpg"/></a>
<a href="#" title="True Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVgJu6sJEk0peX01WQiU0__BAJCy261i_ntJzxSaXeD9FEqgnzk94s-OpehW9iiwY_YFjLrNv36wy66-4bnRQm705jtV4Zqu1w0CdagH5sgYIYcPcA2Fz8faCKfzegrt4OGzhJcbQLJiU3/s85/sample3.jpg"/></a>
<a href="#" title="Sunrise"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUviBwNOrnK0Ko4COysgzWbVXbsldWWdSNvANtjVu-D4Hu3un2DPXOt7GUNCs4r1a2Vpqt56SGIi1hxGopGJNpZY4fdfxXcfI0fc0rN7-_IH2X0ESUzZCfymHOfBTQZnyjdgqvSVg0-NOM/s85/sample4.jpg"/></a>
<a href="#" title="CAR in HDR Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibzdzl18iqMBT6id6KiJTq3FqCU3gf05TMkiKzazz7u7yZPzp64viOKPlT-A6sG6J2vw69V5yO-kX0wzjeqn48dw9_0hQDDENxwPZD5RE_Q7UMdDHymToww9meuWOLjj8O1TsE8QUMdz0e/s85/sample5.jpg"/></a>
<a href="#" title="Sunshine"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOS3sdUz1QPL17phtUBam2IkVFl7tJ7QJHriowJEc8Yb46Ydob5IzfhiEgEnUSC7dmu9GkS7xnxjn6gm1OcwpjwAf693eqo1Tuuq5Yf5__Tw-K8wdNMfgqVTEkwOwKdxRjW_xDD6ALK0v4/s85/sample6.jpg"/></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://dimpost.googlecode.com/files/wow-slider.js"></script>
Ukuran 550x309
ukuran 85x48
0 komentar:
Posting Komentar