Tạo hiệu ứng chuyển động đẹp cho Online Status Xenforo

Thảo luận trong 'Website' bắt đầu bởi Feeder, 13/3/16.

  1. Feeder

    Feeder Administrator Thành viên BQT

    Bài viết:
    458
    Đã được thích:
    4
    Online Status hiển thị tình trạng online của thành viên trên diễn đàn, mặc định nó chỉ là 1 dấu nhỏ nằm ở góc avatar trông khá là đơn điệu, hôm nay mình sẽ hướng dẫn các bạn tạo thêm hiệu ứng chuyển động kiểu phát sáng tỏa ra trông bắt mắt hơn rất là nhiều, và cũng cực kỳ đơn giản.

    [​IMG]


    Việc đơn giản các bạn cần chỉ là copy đoạn code css sau đây vào template EXTRA.css
    HTML:
    .messageUserBlock div.avatarHolder .onlineMarker { display: inline-block; width: -62px; height: px; /* margin: 9px 0 0 9px; <- if you'd like it on top left */ margin: 79px 0 0 79px; background: #fff; border: none!important; border-radius: 50%!important } .messageUserBlock div.avatarHolder .onlineMarker:before { content: ''; position: absolute; width: 10px; height: 10px; margin: 3px 0 0 3px; background: #BD0101; border-radius: 50% } .messageUserBlock div.avatarHolder .onlineMarker:after { content: ''; position: absolute; width: 32px; height: 32px; margin: -16px 0 0 -16px; border: 8px solid #BD0101; border-radius: 50%; box-shadow: 0 0 4px #7fb900, inset 0 0 4px #7fb900; -webkit-transform: scale(0); -webkit-animation: online 2.5s ease-in-out infinite; animation: online 2.5s ease-in-out infinite } @-webkit-keyframes online { 0% {opacity: 1;-webkit-transform: scale(0)} 50% {opacity: .7} 100% {opacity: 0;-webkit-transform: scale(1)} } @keyframes online { 0% {opacity: 1;transform: scale(0)} 50% {opacity: .7} 100% {opacity: 0;transform: scale(1)} }
    
     

    Loading...

    Bình Luận Bằng Facebook

  2. thangav26

    thangav26

    Bài viết:
    22
    Đã được thích:
    0
    hay lắm, thanks bro
     
  3. giapnv1994

    giapnv1994

    Bài viết:
    11
    Đã được thích:
    0
    Online Status hiển thị tình trạng online
     
  4. teooilioo

    teooilioo

    Bài viết:
    10
    Đã được thích:
    0
    Bài viết hay và rất đáng đọc!
     
  5. tontiteoz

    tontiteoz

    Bài viết:
    8
    Đã được thích:
    0
  6. khoexinh11

    khoexinh11

    Bài viết:
    3
    Đã được thích:
    0
    Giảm Cân Eva Nice
    Sản phẩm chiết xuất 100% từ thiên nhiên và được nhập khẩu từ HongKong giúp bạn giảm cân một cách tự nhiên. Sản phẩm được nhiều khách hàng lừa chọn nhất.
    Các bạn không phải lo lắng vấn đề giảm cân nữa khi đã có em Eva nice nhé


    [​IMG]

    Eva nice khuyến mại 490.000 vnđ/ hôp nhanh tay đặt hàng nhé

    Điều chỉnh chế độ uống:Bạn hãy uống nươc theo nhu cầu cơ thể ít nhất 2 lít nước mỗi ngày để da bạn vẫn đẹp cho dù trọng lượng cơ thể giảm đi. Cho bạn vóc dáng ngọc ngà

    Hướng dẫn sử dụng- Thuốc giảm cân Eva Nice dùng cho cả nam và nữ từ 16 đến 65 tuổi. - Đối với người huyết áp cao hoặc huyết áp thấp: 1 viên/ngày sau bữa ăn sang. - Người bình thường: 1 viên/ ngày trước bữa ăn sáng. - Nếu thấy mệt, trước khi uống Thuốc giảm cân Eva Nice hãy uống 100ml sữa không đường hoặc 200ml nước tinh khiết.​

    giam can o mai
    Website : khoedeptn.com
    Hotline : 090.4422.739 - 0983.986.913
    Đ/c : Tổ 28, Thịnh Liệt, Hoàng Mai, Hà Nội

    $Link$

     
  7. dienmaysaigon001

    dienmaysaigon001

    Bài viết:
    8
    Đã được thích:
    0
  8. dienmaytrangiaabc

    dienmaytrangiaabc

    Bài viết:
    43
    Đã được thích:
    0
  9. Sieuthicongnghe

    Sieuthicongnghe

    Bài viết:
    122
    Đã được thích:
    0
    Công ty Giải Pháp Việt chuyên:



    Chúng tôi là chuyên gia:

    - Quảng cáo Google, Facebook, Zalo, Coccoc giá rẻ nhất Việt Nam.

    - Thiết kế website giá rẻ: Chỉ từ 1.500.000đ (Miễn phí tên miền và hosting)

    - Cập nhật nội dung, đăng sản phẩm, chỉ từ 500.000đ/tháng

    - Xây dựng web vệ tinh, tối ưu bộ máy tìm kiếm SEO giá siêu rẻ

    - Email Marketing: Gửi 10.000 mail - 20.000 mail hoặc 50.000mail ngày giá rất rẻ chỉ từ 30.000đ/Ngày hoặc theo số lượng cụ thể.
     
  10. minhhieuk99999

    minhhieuk99999

    Bài viết:
    11
    Đã được thích:
    0
    Cảm ơn thông tin hữu ích từ bạn mình có thêm thông tin về vấn đề này
     
  11. baocomy

    baocomy

    Bài viết:
    17
    Đã được thích:
    0
    cảm ơn ! bài viết hữu ích
     
  12. baocomy

    baocomy

    Bài viết:
    17
    Đã được thích:
    0
    cảm ơn ! bài viết hữu ích
     
  13. tranhoang559987

    tranhoang559987

    Bài viết:
    90
    Đã được thích:
    0
    Đúng thông tin mình cần , đang tìm kiếm bữa giờ mà chưa thấy
     
  14. tranhoang559987

    tranhoang559987

    Bài viết:
    90
    Đã được thích:
    0
    Đúng thông tin mình cần , đang tìm kiếm bữa giờ mà chưa thấy
     
  15. muaborac

    muaborac

    Bài viết:
    77
    Đã được thích:
    0
    KHUYẾN MÃI THIẾT KẾ WEB TẠI THIETKEWEBCHUYEN . COM - TRỌN GÓI CHỈ 1,900,000 - 0986.184.211 + 0902.836.561
    DEMO:
    uyenhousespa . com
    cosomaythiennhat . com


    Nhân dịp giáng sinh và năm mới - Thiết kế web theo yêu cầu trọn gói chỉ còn 1,900,000 VNĐ
    - Tặng miễn phí: 1 tên miền quốc tế sử dụng trong 1 năm và 1 hosting việt nam sử dụng trong 1 năm
    - Web chuẩn SEO 100% sẵn sàng cho chạy quảng cáo google adword và sử dụng sau khi thiết kế
    - Hiển thị tốt trên tất cả thiết bị di động
    - BẢO HÀNH VĨNH VIỄN
    LIÊN HỆ:
    Phone: 0986.184.211 (VIBER/ZALO) - 0902.836.561
    Add: 134/15 Huỳnh Văn Nghệ, P15, Tân Bình, TPHCM
     
  16. muaborac

    muaborac

    Bài viết:
    77
    Đã được thích:
    0
    KHUYẾN MÃI THIẾT KẾ WEB TẠI THIETKEWEBCHUYEN . COM - TRỌN GÓI CHỈ 1,900,000 - 0986.184.211 + 0902.836.561
    DEMO:
    uyenhousespa . com
    cosomaythiennhat . com


    Nhân dịp giáng sinh và năm mới - Thiết kế web theo yêu cầu trọn gói chỉ còn 1,900,000 VNĐ
    - Tặng miễn phí: 1 tên miền quốc tế sử dụng trong 1 năm và 1 hosting việt nam sử dụng trong 1 năm
    - Web chuẩn SEO 100% sẵn sàng cho chạy quảng cáo google adword và sử dụng sau khi thiết kế
    - Hiển thị tốt trên tất cả thiết bị di động
    - BẢO HÀNH VĨNH VIỄN
    LIÊN HỆ:
    Phone: 0986.184.211 (VIBER/ZALO) - 0902.836.561
    Add: 134/15 Huỳnh Văn Nghệ, P15, Tân Bình, TPHCM
     
Tags:

Chia sẻ trang này