MyBBDepo - Türkiyenin MyBB Deposu Forumuna Hoşgeldiniz
Eğer sitemize yaptığınız ilk ziyaretiniz ise, lütfen öncelikle Forum Kurallarını okuyunuz. Forumumuzda bilgi alışverişinde bulunabilmeniz için Kayıt olmalısınız. Üye olmayanlar forumumuzdan yararlanamazlar.
Eğer zaten kayıtlı kullanıcı iseniz, lütfen kullanıcı adınız ve şifreniz ile, Giriş yapınız. (Sitemize üyelik ücretsizdir).
Root Man avatar
Konuyu Oyla:
  • Derecelendirme: 0/5 - 0 oy
  • 1
  • 2
  • 3
  • 4
  • 5

Derecelendirme: 0/5 - 0 oy

MyBB Hareketli Dönen Avatar


Sponsor Reklam
media venus

Çevrimdışı Root Man
 Tarih: 11-04-2014, Saat:14:05
#1
Kod:
http://baglanforum.10tl.net/showthread.php?tid=759&pid=1918#pid1918

postbit_avatar şablonunu boşaltın alttakileri yapıştırın;
Kod:
<div align="center" class="imgholder">
        <div class="outer1 circle"/></div>
        <div class="outer2 circle"/></div>
        <figure>
<div class="postuseravatar1" href="{$post['profilelink_plain']}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}">
<center>
<img src="{$post['avatar']}" alt="{$post['avatar']}" title="{$post['avatar']}"/>
</center>
</div>
<figcaption class="caption">
            <span class="username">
             <div class="username_container">
            
            </span>
    </figcaption>        
        </figure>
    </div>


Temanızın css alanına ekleyin;

Kod:
.imgholder{
    position:relative;
    width:120px;
    height:120px;
    border-radius:100px;
    float:left;
    margin:40px 30px;
}
/* thumbnails style */
.imgholder img{
    position:absolute;
    left:0;
    top:0;
    width:120px;
    height:120px;
    z-index:5;
    border-radius:100px;
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
    opacity:0.3;
    filter: alpha(opacity = 30);
    box-shadow:0 0 5px #000;
    -moz-box-shadow:0 0 5px #000;
    -webkit-box-shadow:0 0 5px #000;
    
    transform: scale(0.5,0.5);
    -ms-transform: scale(0.5,0.5);
    -moz-transform: scale(0.5,0.5);
    -webkit-transform: scale(0.5,0.5);
    
    transition:
        opacity 1s,
        transform 1s ease-in-out 0.3s;
    -moz-transition:
        opacity 1s,
        -moz-transform 1s ease-in-out 0.3s;
    -webkit-transition:
        opacity 1s,
        -webkit-transform 1s ease-in-out 0.3s;
}
.imgholder:hover img{
    opacity:1;
    filter: alpha(opacity = 100);
    transform: scale(1,1);
    -ms-transform: scale(1,1);
    -moz-transform: scale(1,1);
    -webkit-transform: scale(1,1);
}

.imgholder figcaption{
    position:absolute;
    left:-5px;
    top:40%;
    width:130px;
    color:#004E87;
    font-weight:bold;
    text-shadow:-1px -1px 0 #fff;
    z-index:4;
    
    transition:
        top 0.5s ease-out;
    -moz-transition:
        top 0.5s ease-out;
    -webkit-transition:
        top 0.5s ease-out;
}
.imgholder:hover figcaption{
    top:120%;
}
/* decorations style */
.imgholder .circle{
    position:absolute;
    border-radius:100px;
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
}
.imgholder .outer1{
    top:-8px;
    left:-8px;
    width:120px;
    height:120px;
    z-index:2;
    
    border:8px solid;
    border-color:#DEEBFC;
    box-shadow:0 0 3px #AFD3FF;
    -moz-ox-shadow:0 0 3px #AFD3FF;
    -webkit-box-shadow:0 0 3px #AFD3FF;
    
    background: #ffffff;
    background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #e2efff 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#ffffff), color-stop(100%,#e2efff));
    background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
    background: -o-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
    background: -ms-radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
    background: radial-gradient(center, ellipse cover, #ffffff 0%,#e2efff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2efff',GradientType=1 );
    
    transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -webkit-transform:rotate(90deg);
    
    transition:
        transform 1.8s ease-in-out,
        box-shadow 1s ease-out,
        border-color 1.5s;
    -moz-transition:
        -moz-transform 1.8s ease-in-out,
        -moz-box-shadow 1s ease-out,
        border-color 1.5s;
    -webkit-transition:
        -webkit-transform 1.8s ease-in-out,
        -webkit-box-shadow 1s ease-out,
        border-color 1.5s;
}
.imgholder:hover .outer1{
    border-color:#0088EA #7FC9FF #0088EA #7FC9FF;
    box-shadow:0 0 10px #0285E2;
    -moz-box-shadow:0 0 10px #0285E2;
    -webkit-box-shadow:0 0 10px #0285E2;
    transform:rotate(-10deg);
    -ms-transform:rotate(-10deg);
    -moz-transform:rotate(-10deg);
    -webkit-transform:rotate(-10deg);
}
.imgholder .outer2{
    top:-18px;
    left:-18px;
    width:136px;
    height:136px;
    z-index:1;
    
    border:10px solid;
    border-color: #D6E5FC #9BC8FF #D6E5FC #9BC8FF;
    box-shadow:0 0 20px #8EB9FF;
    -moz-box-shadow:0 0 20px #8EB9FF;
    -webkit-box-shadow:0 0 20px #8EB9FF;
    opacity:0;
    filter: alpha(opacity = 0);
    
    transform: scale(1.3,1.3) rotate(180deg);
    -ms-transform: scale(1.3,1.3) rotate(180deg);
    -moz-transform: scale(1.3,1.3) rotate(180deg);
    -webkit-transform: scale(1.3,1.3) rotate(180deg);
        
    transition:
        opacity 0.5s,
        transform 0.7s ease-out;
    -moz-transition:
        opacity 0.5s,
        -moz-transform 0.7s ease-out;
    -webkit-transition:
        opacity 0.5s,
        -webkit-transform 0.7s ease-out;
}
.imgholder:hover .outer2{
    opacity:0.9;
    filter: alpha(opacity = 90);
    transform: scale(1,1) rotate(-10deg);
    -ms-transform: scale(1,1) rotate(-10deg);
    -moz-transform: scale(1,1) rotate(-10deg);
    -webkit-transform: scale(1,1) rotate(-10deg);
}



Yapımcı ; DieseL
Cevapla
Bunu Beğenenler: Manager
Sponsor Reklam
sponsor reklam sponsor reklam

 


Konu ile Alakalı Benzer Konular
Konular Yazar Yorumlar Okunma Son Yorum
Eklenti - Yama - Plugin MyBB Profil Müziği Eklentisi Mısırga 43 11,374 28-07-2016, Saat:01:01
Son Yorum: Mısırga
  MyBB Profilde Kullanıcı ID Plugin EmreKRMN 5 1,368 30-05-2016, Saat:14:41
Son Yorum: 1907fb
  MyBB Kullanıcı Adı Geçmişi, Limiti ve İzni Eklentisi [Plugin] BlackCat 13 3,750 18-05-2016, Saat:18:29
Son Yorum: BlackCat
  [MCTR - 1.6] MYPS MyBB Para Sistemi + Türkçe + Plugin BlackCat 91 36,144 17-02-2016, Saat:18:19
Son Yorum: torres
  [MD - 1.6]  Default Avatar Owner 11 9,606 31-01-2016, Saat:17:03
Son Yorum: EmreUnal27



Konuyu Okuyanlar: 1 Ziyaretçi