Sitene Resim Slayt Ekle

   Blogger sitene açıklamalı resim Sayısı arttırabilir ÖZELLİKLİ resim slayt ekleyebilirsiniz.Sitene gadget ekleme method Ile ekleyebilirsiniz.Ayrıca makale yazı İÇERİSİNDE hazırlayacak Olduğunuz yazıya ait resimlerinizi de sergileyebilirsiniz.

   Altta ki resim slayt kodunun İÇERİSİNDE değiştirilecek Yerleri Farklı Renklerle belirtilmiştir.

<! - Etralibela-61.blogspot.com Bilgi Cafem 61 ->
<Script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type = "text / javascript"> </ script>
<Script src = "http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js" type = "text / javascript"> </ script>
<Script type = "text / javascript">
$ (Document) .ready (function () {$ () "# ul> özellikli" sekmeleri ({fx: {opacity:.. "Geçiş"}}) sekmeleri) (5000, "döndürmek" gerçek;});
</ Script>
<Style type = "text / css">
#featured {
genişlik: 400px;
padding-right: 250px;
position: relative;
Yükseklik: 250px;
background: #fff;
Sınır: 5px katı #ccc;
}
#featured ul.ui-tabs-nav {
position: absolute;
Üst: 0; Sol: 400px;
list-style: none;
padding: 0; margin: 0;
genişlik: 250px;
}
#featured ul.ui-tabs-nav li {
padding: 1px 0; padding-left: 13px;
font-size: 12px;
color: # 666;
}
#featured ul.ui-tabs-nav li yayılma {
font-size: 11px; font-family: Verdana;
line-height: 18px;
}
#featured .ui-tabs panel {
genişlik: 400px; Yükseklik: 250px;
background: # 999; position: relative;
taşma: gizli;
}
#featured .ui-tabs gizle {
display: none;
}
#featured li.ui-tabs-nav-öğe {/ * Hover Stil On * /
display: block;
Yükseklik: 60px;
color: # 333; background: #fff;
line-height: 20px;
anahat: hiçbiri;
}
#featured li.ui-tabs-nav-öğe: hover {
background: # f2f2f2;
}
#featured li.ui-tabs-seçilmiş {/ * Seçilen sekme tarzı * /
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbGJD8MxZj9sxFk6A1LZl-oYEMMj-yv6jnd2VGZ_DkesGNnTLavsP8zZHDOLzGMWaLtWWb4ipUD4sp8p6wuhUoGxybacPEjDuMBuS4DVLq7Dm0fne64Vu_tzh6KkS9RJ-6EaZMhcSCrBDm/s1600/selected-item.gif')
 Üst hiçbir tekrarı yaptı;
}
#featured ul.ui-tabs-nav li.ui-tabs-seçilmiş bir {
background: #ccc;
}
#featured ul.ui-tabs-nav li img {
şamandıra: Sol; margin: 2px 5px;
background: #fff;
padding: 2px;
Sınır: 1px solid #eee;
}
.info #featured .ui-tabs panel {
position: absolute;
Üst: 180px; Sol: 0;
Yükseklik: 70px; genişlik: 400px;
background: url ('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0pgJcD1n6Ye3lDPJX4rUqoz7ZZouWxoD7w_NgmLT9qUTQ_9_cH3KnZ4pDQfFlq3jRiTBxmClARNhFm6YdmmKX9uA_Pggq5q-V63lMul5dQyRTteWgpAty3ZXU1xknlPWeHWktgy7pn3x6/s1600/117s1g9.jpg');
}
h2 .info #featured {
font-size: 14px; font-family: Gürcistan, serif;
Renk: #fff; padding: 5px; margin: 0;
taşma: gizli;
}
p .info #featured {
margin: 0 5px;
font-family: Verdana; font-size: 11px;
line-height: 15px; color: # f0f0f0;
}
.info #featured bir {
text-decoration: none;
Renk: #fff;
}
Bir .info #featured: {hover
text-decoration: underline;
}
</ Style>
<Div id = "özellikli">
<Ul class = "ui-tabs-nav">
<Li class = "ui-tabs-nav-madde" id = "nav-fragmanı-1"> <a 
href = "# fragmanı-1"> <img alt = "1 özellikli" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJV8IrqZq8ilDzPmILTkoXcvJP7BhQRA2E1kyByHlxRjYf8A60vIvHpl4tkpFbyQgrDW0WZ6d_onC9_JN-8N_RsAzPOcxegivtd-vO7MSKGV8i2RQsVRvKSYbckeKP0RmoBAOEXfYicqcD/s1600/1.png"/><span>TITLE
 1 </ span> <a </ li>
<Li class = "ui-tabs-nav-madde" id = "nav-fragmanı-2"> <a 
href = "# fragmanı-2"> <img alt = "2 özellikli" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6FbtsBNZtnRtZhmjndy0YwdNSMFr_rrUfkoXWzK1VegRuivq0yLDnH5p0T-h2iCOpAM6QDn998ZUiipyoFTnb6fMc46kpcc96HMPMse5TPJUjI9DOi20KJrQd6cnexhDUjLli6oUunOJY/s1600/2.png"/><span>TITLE
 2. </ span> <a </ li>
<Li class = "ui-tabs-nav-madde" id = "nav-fragmanı-3"> <a 
href = "# fragmanı-3"> <img alt = "3 özellikli" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKPxNsP7EgS4B1lSCkEbOvc_g_NGCseATzQ13H_gPCZkKMXHKZJl0Txg7ZN52Cn4PsFFNgxDjUGoAl3nsOpf6wCghEYLww85Qi1I9Zn3zPScDxLsJU8bYC188zM7UE4ndPDItzMjX1L75u/s1600/3.png"/><span>TITLE
 3 </ span> <a </ li>
<Li class = "ui-tabs-nav-madde" id = "nav-fragmanı-4"> <a 
href = "# fragmanı-4"> <img alt = "4 özellikli" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCdH05YEX3muhPN_g1VLtIqdGCBST7d04f6RAPVjBnYqJUBVJBQ1wMKANxh9sL4ishluaFAdK5jwZnhi4xTS9seSgzF2HWjQwuPOPphN5dmiZ_NMSNhS4_McmPVJz2ENgPzTjUrCLX1FuK/s1600/4.png"/><span>TITLE
 4. </ span> <a </ li>
</ Ul>

<! - SLAYT Başlangıcı RESİM EKLE ->
<Div id = "fragmanı-1" class = "ui-tabs-paneli" style = "">
<Img alt = "" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjjZOit2efbIUtLms-7ODywEpCb8Lm8pSjpIIOgWNmE8kGgO2a0VpmyGJI2UyWRteuevifqFVGll2qdLSI0w5H1NJjLhxeB45zhO_m9rLv6NIIgFtHRw36C-AktVMKXOufgcvzledu_bgY/s1600/blogkodu1.png"/>
<Div class = "info">
<H2> <a href="#" target="_blank"> RESİM Başlığı EKLE 1 </a> </ h2>
<P> RESİM AÇIKLAMA EKLE </ p>
</ Div>
</ Div>
<Div id = "fragmanı-2" class = "ui-tabs panel ui-tabs-hide" style = "">
<Img alt = "" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU5Q_aF2R77HzYpkR9HR-43h6DML1SgFLAgXWworVATaePNQTdMyKyqVY0njPn927rdeSK37O9PvUn4Yce7UT29NvDJ9jGDkfKBAzRdQvi2XEC4x31-EVmsrqF6uiVmqvJfxDW4oDEKEQG/s1600/blogkodu2.png"/>
<Div class = "info">
<H2> <a href="#" target="_blank"> RESİM Başlığı EKLE 2 </a> </ h2>
<P> RESİM AÇIKLAMA EKLE 2 </ p>
</ Div>
</ Div>
<Div id = "fragmanı-3" class = "ui-tabs panel ui-tabs-hide" style = "">
<Img alt = "" 
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp8vvvPg6lfAr35TQ3kqeXg2b-_6cd7X35lqfz9wy298L5gTbS0z2epwFz8f960S_tDjx54iRqdr1ifu7xxFqFQiVk7DFotQVK5b1eXF2n6nXHHBWV1N09B25VIp_xio5d-UjpPPkwOg-n/s1600/blogkodu3.png"/>
<Div class = "info">
<H2> <a href="#" target="_blank"> RESİM Başlığı EKLE 3 </a> </ h2>
<P> RESİM AÇIKLAMA EKLE 3 </ p>
</ Div>
</ Div>
<Div id = "fragmanı-4" class = "ui-tabs panel ui-tabs-hide" style = "">
<Img alt = "" 
src = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrx7cg37YxKArVMxIVr_LKoAokzOD3Uyl1I3-aGu6_FSyzxBYAju4wGRI0JuAgfYaP5Che_o68mcKGlcHZLHQailArH_yjp5eoLJkKt56Gn8oO08WyE8em6wXwk7MX5NwSHKP369p2ahkn/s1600/blogkodu4.png" />
<H2> <a href="#" target="_blank"> RESİM Başlığı EKLE 4 </a> </ h2>
<P> RESİM AÇIKLAMA EKLE 4 </ p>
</ Div>
</ Div>
<Div style = "clear: both;"> </ div>
<br/>
<Div> </ div>
<! - Etralibela-61.blogspot.com Bilgi Cafem 61 ->

Blogumuza Abone Olun
Yeni Yazılar e-posta Adresinize Gelsin