Blogger duyuru eklentisi
Kendim blogum için duyuru eklentisi arıyordum.Sitemizin sol tarafına bakarsanız bulduğumu anlarsınız.Eğer sizde böyle duyuru eklentisi arıyorsanız ya da hoşunuza gitdiyse hemen kodları paylaşıyorum.Kodları sitenize eklemek için Yerleşim kısmından--> Gadget Ekle -->Html/Javascript ekliye bilirsiniz.
<div class="yuvarlanan-duyuru eklentisi"><div class="divix">
<div style="position:absolute;top:0px;left:0px;font-family:Helvetica, Arial, sans-serif;font-weight:normal;
font-size:13px;color:#fff;background-color:#e84343;" class="duyuristan">
<span style="display:block;margin-left:40px;">
<b>Merhaba Dünyalı !</b>
<br/>
Bu eklenti sizler için uzaydan gönderildi.
<br/>
Beğenmeniz umuduyla (uzaylı bir dost)
</span>
</div>
<style>.divix{height:95px;position:absolute;top:0px;left:0px;min-width:86px;}.duyurucaz{text-decoration:none !important;text-align:center;line-height:60px;font-family:Helvetica, Arial, sans-serif;font-weight:bold;font-size:17px;color:#fff;position:absolute;top:0px;left:-3px;display:inline-block;height:80px;width:80px;background:#e84343;border:2px solid #ff9c9c;}</style>
<div class="duyurucaz">Heyyy !</div></div></div><style>.duyurucaz{text-decoration:none !important;text-align:center;line-height:60px;font-family:Helvetica, Arial, sans-serif;font-weight:bold;font-size:17px;color:#fff;position:absolute;top:0px;left:-3px;display:inline-block;height:80px;width:80px;background:#e84343;}.duyurucaz{-webkit-transition: all 1s cubic-bezier(0.6, -0.83, 0.805, 1.425);-moz-transition: all 1s cubic-bezier(0.7, -0.8, 0.805, 1.3);-o-transition: all 1s cubic-bezier(0.7, -0.83, 0.805, 1.3);transition: all 1s cubic-bezier(0.7, -0.83, 0.805, 1.3);cursor:pointer;}.duyuristan{padding-right:30px;height:80px;text-decoration:none !important;padding-top:4px;overflow:hidden;background:#fff;border:none;border-color:#ff9c9c;border-width:0px;width:0px;-webkit-transition: width 1s cubic-bezier(0.6, -0.83, 0.805, 1.425);-moz-transition: width 1s cubic-bezier(0.7, -0.8, 0.805, 1.3);-o-transition: width 1s cubic-bezier(0.7, -0.83, 0.805, 1.3);transition: all 1s cubic-bezier(0.7, -0.83, 0.805, 1.3);}.divix:hover .duyurucaz{height:80px;margin-left:300px;transform:rotate(360deg);-ms-transform:rotate(360deg); /* IE 9 */-moz-transform:rotate(360deg); /* Firefox */-webkit-transform:rotate(360deg); /* Safari and Chrome */-o-transform:rotate(360deg); /* Opera */-webkit-border-radius: 40px;border-radius: 40px;}.divix:hover .duyuristan{background-color:#e84343;border:1px solid #ff9c9c;width:298px;height:78px;}div.yuvarlanan-duyuru{position:fixed;z-index:999999;}div.eklentisi{top:140px;left:0px;}</style><style type="text/css">div.yuvarlanan-duyuru{_position:absolute;}div.eklentisi{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}
</style>
Kırmızı kısımları kendinize göre düzenliyin.Duyuru sağ tarafa almak için < -style-> bölümünde .divix‘deki left kodunu right yapabilirsiniz.
Yorumlarınızı bekliyorum
Etiketler: Blogger duyuru eklentisi, blogger eklentileri, blogger-eklenti
0 Yorum:
Yorum Gönder
Yorumlarınız için teşkür ederim
Kaydol: Kayıt Yorumları [Atom]
<< Ana Sayfa