Adana Adıyaman Afyon Ağrı Aksaray Amasya Ankara Antalya Ardahan Artvin Aydın Balıkesir Bartın Batman Bayburt Bilecik Bingöl Bitlis Bolu Burdur Bursa Çanakkale Çankırı Çorum Denizli Diyarbakır Düzce Edirne Elazığ Erzincan Erzurum Eskişehir Gaziantep Giresun Gümüşhane Hakkari Hatay Iğdır Isparta İstanbul İzmir K.Maraş Karabük Karaman Kars Kastamonu Kayseri Kırıkkale Kırklareli Kırşehir Kilis Kocaeli Konya Kütahya Malatya Manisa Mardin Mersin Muğla Muş Nevşehir Niğde Ordu Osmaniye Rize Sakarya Samsun Siirt Sinop Sivas Şanlıurfa Şırnak Tekirdağ Tokat Trabzon Tunceli Uşak Van Yalova Yozgat Zonguldak

İstanbul 20 °C

Az Bulutlu

Üyelik

vB5: Saf CSS kullanarak Yeşil Çevrimiçi simgesi “Glow” nasıl yapılır vBulletin “Glow” nasıl yapılır vBulletin Yeni 2019

Bilgi Dünyası

28.04.2019

360

A⁺

A^-

“Glow” nasıl yapılır

Hareketli gif yok. JQuery animasyonu yok. Ek resim yok. Sadece saf CSS3 animasyon serinliği.

Bunu ek css şablonuna veya Sitebuilder> Stil> CSS Düzenleyicisi ile ekleyin:

Kod:

.b-icon__status - yeşil: sonra {
    içerik: '';
    sınır: 10px katı # 6e9d00; / * yeşil, gerektiği gibi değiştirin * /
    arka plan: şeffaf;
    sınır yarıçapı: 40 piksel;
    yükseklik: 40px;
    genişlik: 40px;    
    pozisyon: mutlak;
    üst: -24px; / * varsayılan konumdan çıkardığınızda bunu ince ayar yapmanız gerekebilir * /
    solda: -22px; / * varsayılan konumdan çıkardığınızda bunu ince ayar yapmanız gerekebilir * /
    z-endeksi: 1;
    opaklık: 0;
    -webkit-animasyonu: sonsuz 3 saniye kolaylıkla kızdırma;
    animasyon: kızdırma 3s sonsuz kolay;
}

@ -webkit-keyframes kızdırma {
    0% {
        -webkit-dönüşümü: ölçek (0);
        opaklık: 0.0;
    }

    % 25 {
        -webkit-dönüşümü: ölçek (0);
        opaklık: 0.1;
    }

    % 50 {
        -webkit-dönüşümü: ölçek (0.1);
        opaklık: 0.3;
    }

    % 75 {
        -webkit-dönüşümü: ölçek (0.5);
        opaklık: 0.5;
    }

    100% {
        -webkit-dönüşümü: ölçek (1);
        opaklık: 0.0;
    }
}

@keyframes kızdırma {
    0% {
        dönüşümü: ölçek (0);
        opaklık: 0.0;
    }

    % 25 {
        dönüşümü: ölçek (0);
        opaklık: 0.1;
    }

    % 50 {
        dönüşümü: ölçek (0.1);
        opaklık: 0.3
    }

    % 75 {
        dönüşümü: ölçek (0.5);
        opaklık: 0.5;
    }

    100% {
        dönüşümü: ölçek (1);
        opaklık: 0.0;
    }
}

Vb5 için GIPHY AutoLinker postbit'deki Sosyal Simgeleri Ses Oyuncu Önbelleği Cron DragDrop yükle Konu OtomatikGüncelleştir'i Kuvvet Oku mesajına Dur Linkler ... ve daha fazlası!