إضافة تأثير على الصورة الرمزية عند تمرير الماوس

الحالة
مغلق و غير مفتوح للمزيد من الردود.

Alrajabane 

【ℜ𝔥𝔦𝔟】
:: وّأِحُدّ مًنُ أٌلِنُأًسُ ::

إنضم
2016 - 8 - 7
المشاركات
2,654
الحلول
5
مستوى التفاعل
337
النقاط
1,795
الإقامة
السعودية
  • التقييمات: 0
  • #1

سنقدم لك تأثيرًا رائعًا عند مرور الماوس على الصورة الرمزية. ما عليك سوى لصق كود css في قالب extra.less للستايل المراد التعديل عليه.

كود:
extra.less

CSS:
/*avatar MAAIDNI MohammeD*/
.message-avatar-wrapper .avatar:before,
.message-avatar-wrapper .avatar:after{
    border-color: #00c5de;
}
.message-avatar-wrapper a:before,
.message-avatar-wrapper a:after{
    content: "";
    display: block;
    position: absolute;
    background: transparent;
    top: 0; bottom: 0; left: 0; right: 0;
    border-radius: 5%; /*Ne touchez pas ce paramètre si vous avez un avatar carré ou rectangulaire. Si vous avez un avatar, changez simplement le réglage sur "50%".*/
    transition: .3s all;
    border: 2px solid;
}
.message-avatar-wrapper a:hover:after{
   -webkit-transform: scale(1.5);
}
.message-avatar-wrapper a:hover:before{
    -webkit-transform: scale(2);
    transition: .3s all;
    opacity: 0;
}
/*avatar MAAIDNI MohammeD*/


 

Abu-Nayef 

☆(❁‿❁)☆
رفيق ردب

إنضم
2017 - 8 - 6
المشاركات
253
مستوى التفاعل
64
النقاط
27
الإقامة
Riyadh

ممتاز يعطيك العافية
 

الحالة
مغلق و غير مفتوح للمزيد من الردود.

أعلى