MyBB Depo Forum
[1.4 - 1.6] 3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - Baskı Önizleme

+- MyBB Depo Forum (https://mybbdepo.com)
+-- Forum: MyBB 1.6 Depo (https://mybbdepo.com/mybb-1-6-depo-forumu)
+--- Forum: MyBB 1.6 Modifikasyon & Eklenti Deposu (https://mybbdepo.com/mybb-1-6-modifikasyon-eklenti-deposu-forumu)
+---- Forum: Ana Sayfa (https://mybbdepo.com/ana-sayfa-forumu)
+---- Konu Başlığı: [1.4 - 1.6] 3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor (/3-adet-duyuru-kutusu-carpiya-basinca-animasyonlu-olarak-kapaniyor-konusu.html)

Sayfalar: 1 2


3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - ByBrown - 05-08-2012

Arakadaşlar ben bunu MyBBe uyarladım.Asıl konu:

Kod:
psdup.com

Demo:
Kod:
bybrown.tk

Öncelikle Ekteki Dosyaları İmages İçine Atıyoruz.Sonra Header Şablonda
Kod:
<div id="panel" >
{$welcomeblock }
</div>

Altına Ekliyoruz:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
Design: Catalin Bridinel - bridinel.com
Css & Html : Sirzat Aytac - psdup.com
-->
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Psdup - Dialog Boxes</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
    
    $('.close').click(function() {
        closeid = $(this).attr('id');
        $('.'+closeid).hide('slow', 0);
    });

});
</script>
</head>

<body>
<div id="center">
<div class="dialog success"><span class="close" id="success"></span><span class="icon"></span><h1>Foruma Hoş Geldiniz</h1><p>Giriş <a href="#">Yapın</a>Ya Da Üye <a href="#">Olun</a></p></div>
<div class="dialog info"><span class="close" id="info"></span><span class="icon"></span><h1>Admin: Yeni Temamız Yüklendi</h1><p>Uzun Süredir Üstünde Çalıştığımız Temayı Sonunda Yükledik <a href="#">Tıkla</a>...</p></div>
<div class="dialog warning"><span class="close" id="warning"></span><span class="icon"></span><h1>Dikkat!</h1><p>İnternette Dolaşan Yeni Bir Virüs Bulundu.Konuya Gitmek İçin <a href="#">Tıkla...</a></p></div>
</div>
</body>

</html>




Bunuda Global CSS En Alta Ekliyeceğiz.
Kod:
body1 {
    margin: 0px;
    background-color: #1b2036;
    font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
}
h1 {
    font-size: 18px;
    font-weight: bold;
    margin: 0px;
    padding:8px 0px 0px 0px;
}
p {
    margin: 0px;
    font-size:12px;
}
#center {
    width: 960px;
    margin: 15px auto 0px auto;
}

.dialog {
    height: 60px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    margin-bottom: 20px;
    color:#ffffff;

}
.dialog .icon {
    width: 34px;
    height: 34px;
    display: block;
    margin: 12px 14px 0px 14px;
    float:left;
}
.close {
    display:block;
    height:14px;
    width:14px;
    background:transparent url('../images/close.png') no-repeat;
    position:relative;
    float:right;
    margin:5px 5px 0px 0px;
    cursor:pointer;
}
.success {
    background-color: #7f8f19;
    background-image: -moz-linear-gradient(top, #93A11F 0%, #6E8114 100%);
    background-image: linear-gradient(top, #93A11F 0%, #6E8114 100%);
    background-image: -o-linear-gradient(top, #93A11F 0%, #6E8114 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #93A11F), color-stop(1, #6E8114));
    background-image: -webkit-linear-gradient(top, #93A11F 0%, #6E8114 100%);
    background-image: -ms-linear-gradient(top, #93A11F 0%, #6E8114 100%);
    border-top: 1px solid #b9c22a;
}
.success .icon {
    background: transparent url('../images/success.png') no-repeat;
}

.info {
    background-color: #ffc800;
    background-image: -moz-linear-gradient(top, #ffcc00 0%, #ffb500 100%);
    background-image: linear-gradient(top, #ffcc00 0%, #ffb500 100%);
    background-image: -o-linear-gradient(top, #ffcc00 0%, #ffb500 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffcc00), color-stop(1, #ffb500));
    background-image: -webkit-linear-gradient(top, #ffcc00 0%, #ffb500 100%);
    background-image: -ms-linear-gradient(top, #ffcc00 0%, #ffb500 100%);
    border-top: 1px solid #ffe300;
    color:#dd220d;
}
.info .icon {
    background: transparent url('../images/info.png') no-repeat;
}
.info p {
    color:#000000;
}
.warning {
    background-color: #d61c0b;
    background-image: -moz-linear-gradient(top, #dc220d 0%, #d01609 100%);
    background-image: linear-gradient(top, #dc220d 0%, #d01609 100%);
    background-image: -o-linear-gradient(top, #dc220d 0%, #d01609 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #dc220d), color-stop(1, #d01609));
    background-image: -webkit-linear-gradient(top, #dc220d 0%, #d01609 100%);
    background-image: -ms-linear-gradient(top, #dc220d 0%, #d01609 100%);
    border-top: 1px solid #ee3314;
}
.warning .icon {
    background: transparent url('../images/warning.png') no-repeat;
}



3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - TheLegend - 05-08-2012

Eline sağlık Süper


3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - xpserkan - 05-08-2012

Şimdi bunu ekledikleri zaman çakışma yapacak ve sonra cevap editöründeki butonlar gözükmeyecek.. MyBB'ye uyarladım diyorsunuz fakat çakışmayı önleyici kodu eklememişsiniz, böyle uyarlama olmaz kusura bakmayın hocam. Sonra siteye gelip editör butonlarım gözükmüyor diyorlar anlamayan arkadaşlarımız.. Özellikle jQuery paylaşımlarına çok dikkat edelim ki, kimse çakışma ile uğraşmasın...

Çözümü için ; şu kodları bulun:
Kod:
<script type="text/javascript">
$(document).ready(function(){
    
    $('.close').click(function() {
        closeid = $(this).attr('id');
        $('.'+closeid).hide('slow', 0);
    });

});
</script>

Aşağıdaki ile değiştirin:
Kod:
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function(){
    $('.close').click(function() {
        closeid = $(this).attr('id');
        $('.'+closeid).hide('slow', 0);
    });
});
</script>

Not: Bu tür paylaşımlar yaparken, lütfen çakışmayı önleyici kodu eklemeyi unutmayın. Bu arada teşekkürler..


3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - Takipcİ - 05-08-2012

demo ?


Cvp: 3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - TheLegend - 05-08-2012

(05-08-2012, Saat:14:41)oyun Adlı Kullanıcıdan Alıntı: demo ?

Kod:
bybrown.tk



3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - Screwy - 05-08-2012

Bunu Konu İçinde Uyarı BBCodu İçin Felanda Uyarlıyabilirmiyiz Bence O Şekilde Daha Kullanışlı Olur ?


3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - ByBrown - 05-08-2012

Birşey değil öncelikle serkan abi ben,m sitede çakışma falan yoktu ondan koymadım özür birdaha olmasa dahi kodu ekleyeceğim.


3 Adet Duyuru Kutusu Çarpıya Basınca Animasyonlu Olarak Kapanıyor - MehmetAliCan - 06-08-2012

çakışma mı? Allah yazdıysa bozsun Açık Ağızlı Gülümseme