(09-23-2012, 08:57 PM)kaRanLık-61 Nickli Kullanıcıdan Alıntı:  3 farklı renkte anasayfa görünen duyurulardır.Üzerinde Geldiğiniz Duyuru panosu sağa doğru 5 px kaymaktadır.İnternet Explorer Haricinde Kayması Yawaş Gerçekleşir.Genel Olarak Tüm Taracılarda Düzgün Görünür.

Admin Kp --> ŞAblon&STil --> Şablonlar --> Kullandığınız TEmanın Templatesi --> Anasayfa ŞAblonları --> index

Kod: Tümünü Seç Tümünü Kopyala

{$header}

Bu kodu Bulun ve hemen altına aşağıdaki kodu ekleyin..;

Kod: Tümünü Seç Tümünü Kopyala

<div class="showbox slideright"><div class="duyuru_bar_3"><img src="http://www.kamyoncuyuz.biz/images/duyuru_icon.png" alt="duyuru" style="vertical-align: middle;"> <span style="color: red;">Duyuru-1:</span><strong> Duyurunuzu Ekleyin.</strong> <a href="Duyuru Linki-1" target="_blank">Detaylar İçin Tıkla...</a></div></div>
<div class="showbox slideright"><div class="duyuru_bar_2"><img src="http://www.kamyoncuyuz.biz/images/duyuru_icon.png" alt="duyuru" style="vertical-align: middle;"> <span style="color: red;">Duyuru-2:</span><strong> Duyurunuzu Ekleyin. </strong> <a href="Duyuru Linki-2" target="_blank">Detaylar İçin Tıkla...</a></div></div>
<div class="showbox slideright"><div class="duyuru_bar_4"><img src="http://www.kamyoncuyuz.biz/images/duyuru_icon.png" alt="duyuru" style="vertical-align: middle;"> <span style="color: red;">Duyuru-3:</span><strong>  Duyurunuzu Ekleyin.</strong> <a href="Duyuru Linki-3" target="_blank">Detaylar İçin Tıkla...</a> </div> </div>

kaydetin.

Admin Kp --> Şablonlar&Stil --> Temanızı Seçin --> Global.Css --> Gelişmiş Mod Düzenle

En altına Gelin ve aşağıdaki cssleri ekleyin;

Kod: Tümünü Seç Tümünü Kopyala

.duyuru_bar_2 {
    background: url(../../../images/dyr_mavi.png) repeat-x bottom left #D6ECFD;
        padding: 5px 10px;
        margin-top: 0px;
        font-size: 12px;
        font-family: Tahoma, Geneva, Sans-Serif;
        font-weight: bold;
        margin-bottom: 15px;
        border: 1px solid #46AEFE;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
    box-shadow: 0px 0px 5px #333;
    -moz-box-shadow: 0px 0px 5px #333;
    -webkit-box-shadow: 0px 0px 5px #333;
}




.duyuru_bar_3 {
    background: url(../../../images/dyr_yesil.png) repeat-x bottom left #CCFF00;
    padding: 5px 10px;
    margin-top: 0px;
    font-size: 12px;
    font-family: Tahoma, Geneva, Sans-Serif;
    font-weight: bold;
    margin-bottom: 15px;
    border: 1px solid #33FF33;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0px 0px 5px #333;
    -moz-box-shadow: 0px 0px 5px #333;
    -webkit-box-shadow: 0px 0px 5px #333;
        
}



.duyuru_bar_4 {
    background: url(../../../images/dyr_4.png) ;
    padding: 5px 10px;
    margin-top: 0px;
    font-size: 12px;
    font-family: Tahoma, Geneva, Sans-Serif;
    font-weight: bold;
    margin-bottom: 15px;
    border: 1px solid #f56c87;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0px 0px 5px #333;
    -moz-box-shadow: 0px 0px 5px #333;
    -webkit-box-shadow: 0px 0px 5px #333;
        
}.slideright:hover {
    -webkit-transform: translate(1em, 0pt);
    -moz-transform: translate(1em, 0pt);
    -o-transform: translate(1em, 0pt);
    -ms-transform: translate(1em, 0pt);
}


.showbox {
    -webkit-transition: all 1s ease-in-out 0s;
    -moz-transition: all 1s ease-in-out 0s;
    -o-transition: all 1s ease-in-out 0s;
    -ms-transition: all 1s ease-in-out 0s;
}

Kaydetin.

Artık Duyuru Panomuz Hazır.Ama Değişiklik Yapmanız Gereken Değişiklikler Var.Verdiğim Kodda "Duyurunuzu Ekleyin.,Duyuru Linki-1,Duyuru Linki-2,Duyuru Linki-3" bunları değiştirmeniz gerekir.

Yapımcısı: XpSerkan
ona teşekkür Ediyorum.Hakkını Helal Etsin.Ben Sadece Onun Yaptını Sizlere Anlatarak Sundum.Bir Teşekkür Yeter.Güle Güle Kullanın.İyi Forumlar

Caps:









Resimleri Göremeyen Olursa Ek Olarak Eklenmiştir!