Blogger Resim Slaytlı Manşet Tarzı

DEMO Görüntüsü

Blogger Resim Slaytlı Manşet Tarzı uzerinde yapilacak Değişiklikler Şunlardır;

1. & Lt; a href Ile başlayan 5 adet resim kodu var, Sıralı biçimde Olarak tr üsteki Birinci'nin ve diğerleri devam Ediyor ettik.
2. & Lt; a href = " http://etralibela-61.blogspot.com/ "& gt; kodu resime AIT linkdir.Bunu siz Kendinize GÖRE VEYA Sitenize GÖRE ayarlayın.
3. & Lt; img alt = "Bilgi Cafem61 Slayt Başlığı 1" resmin uzerinde görünecek Olan başlıkdır.
4. Sonda bulunan src = "http: /g1208.hizliresim.com/10/r/c5d0d.jpg" kısmında imkb slaytaki resim linkidir.
5. genişliği: 500px; height: 218px; slaytın Yükseklik A.Ş. genişlik boyutlarını belirler.Siz met ÖZELLİĞİ Kendinize A.Ş. Sitenize GÖRE ayarlayabilirsiniz.
6. Bu ÖZELLİĞİ isterseniz blogger temanıza ekleyebilir VEYA Gadget olarakda ekleyebilirsiniz.

          Kodlar;

& Lt; style = "text / css" & gt tipi;

 Http://www.bloggerdersleri.com/ By / * JavaScript Image Slider * /

{#mcis
 display: none;
}

{#sliderFrame
 position: relative;
 genişliği: 500px;
 margin: 0 auto;
        border: 5px solid # 000;
}

{#ribbon
 genişliği: 111px;
 height: 111px;
 position: absolute;
 top: -4px;
 Sol: -4px;
 background: url () no-repeat;
 z-index: 7;
}

{#slider
 genişliği: 500px;
 height: 218px;
 background: url #fff (http://g1208.hizliresim.com/10/r/c5db2.gif) no-repeat 50% 50%;
 position: relative;
 margin: 0 auto;
 box-shadow: 0px 1px # 999999 5px;
}

#slider img {
 position: absolute;
 border: none;
 display: none;
}

#slider a.imgLink {
 z-index: 2;
 display: none;
 position: absolute;
 top: 0px;
 Sol: 0px;
 Sınır: 0;
 padding: 0;
 margin: 0;
 genişliği: 100%;
 height: 100%;
}

div.mc-caption-bg, div.mc-caption-bg2 {
 position: absolute;
 genişliği: 100%;
 height: auto;
 padding: 0;
 Sol: 0px;
 alt: 0px;
 z-index: 3;
 taşma: hidden;
 font-size: 0;
}

div.mc-caption-bg {
 background-color: black;
}

div.mc-caption {
 font: 14px kalın / 20px Arial;
 Renk: #CCC;
 z-index: 4;
 padding: 10px 0;
 text-align: center;
}

div.mc-caption bir {
 color: # FB0;
}

div.mc-caption a: hover {
 color: # DA0;
}

{div.navBulletsWrapper
 top: 250px;
 Sol: 190px;
 genişliği: 150px;
 background: none;
 padding-left: 20px;
 position: relative;
 z-index: 5;
 imleç: işaretçi;
}

div.navBulletsWrapper div {
 genişliği: 11px;
 height: 11px;
 arka plan: şeffaf url (http://g1208.hizliresim.com/10/r/c5dbx.png) no-repeat 0 0;
 yüzer: sol;
 taşma: hidden;
 vertical-align: middle;
 imleç: işaretçi;
 margin-right: 11px;
 _position: relative;
}

div.navBulletsWrapper div.active {
 background-position: 0 -11px;
}

{#slider
 dönüşümü: translate3d (0,0,0);
 -ms-dönüşümü: translate3d (0,0,0);
 -moz-dönüşümü: translate3d (0,0,0);
 -o-dönüşümü: translate3d (0,0,0);
 -webkit-dönüşümü: translate3d (0,0,0);
}
 & Lt; / style & gt;

& Lt; script src = "http://code.helperblogger.com/js-görüntü-slider.js" type = "text / javascript" & gt; & lt; / script & gt;

& Lt; br / & gt;
& Lt; div id = "sliderFrame" & gt;
& Lt; div id = "şerit" & gt;
& Lt; / div & gt;
& Lt; div id = "kaymak" & gt;
& Lt; a href = "http://etralibela-61.blogspot.com/" & gt; & lt; img alt = "Bilgi Cafem61 Slayt Başlığı - 1" src = "http://capsverlan.com/pictures/cc09620a72fa107f8f8cc85507845a17.jpg "/ & gt; & lt; / a & gt;

& Lt; a href = "http://etralibela-61.blogspot.com/" & gt; & lt; img alt = "Bilgi Cafem61 Slayt Başlığı - 2" src = "http://capsverlan.com/pictures/afc104f4471269fedb47a43e983b54eb.jpg "/ & gt; & lt; / a & gt;

& Lt; a href = "http://etralibela-61.blogspot.com/" & gt; & lt; img alt = "Bilgi Cafem61Slayt Başlığı - 3" src = "http://capsverlan.com/pictures/cd1a89688d8548c452441c57bf29066c.jpg" / & gt; & lt; / a & gt;

& Lt; a href = "http://etralibela-61.blogspot.com/" & gt; & lt; img alt = "Bilgi Cafem61 Slayt Başlığı - 4" src = "http://capsverlan.com/pictures/6884873302225211c91317f69e3e2d41.jpg "/ & gt; & lt; / a & gt;

& Lt; a href = "http://etralibela-61.blogspot.com/" & gt; & lt; img alt = "Bilgi Cafem61 Slayt Başlığı - 5" src = "http://g1208.hizliresim.com/10/r /c5d0d.jpg "/ & gt; & lt; / a & gt;
                & Lt; / div & gt;
& Lt; / div & gt;

Bizi Takip Edin
Pinterest Facebook Twitter
 © by bilgicafem61
Aşağıda Yorum Toplam Sorularinizi Bırakın