Hiệu ứng slide đẹp cho blog - Minh Blogger

đã xuất bản
Chào các bạn, vậy là một mùa giáng sinh nữa sắp đến rồi, nên mình sẽ chia sẻ cho mọi người một hiệu ứng slide đẹp cho blog nhé.


Các bạn có thể thêm JS vào cho nó hoàn thiện hơn vì đây chỉ là một hiệu ứng slide lướt và sau đó sẽ không có gì ở sau nữa nhé :3

Đầu tiên các bạn tạo widget mới và chèn code sau


<script type="text/javascript"> var select = function(s) {     return document.querySelector(s);   },   selectAll = function(s) {     return document.querySelectorAll(s);   },   animationWindow = select('#animationWindow'),        animData = { wrapper: animationWindow, animType: 'svg', loop: true, prerender: true, autoplay: true, path: 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/35984/christmas_pudding_slider.json',   rendererSettings: {     //context: canvasContext, // the canvas context     //scaleMode: 'noScale',     //clearCanvas: false,     //progressiveLoad: false, // Boolean, only svg renderer, loads dom elements when needed. Might speed up initialization for large number of elements.     //hideOnTransparent: true //Boolean, only svg renderer, hides elements when opacity reaches 0 (defaults to true)   }  }, anim; anim = bodymovin.loadAnimation(animData);  anim.addEventListener('DOMLoaded', onDOMLoaded);  anim.setSpeed(1); function onDOMLoaded(e){  anim.addEventListener('complete', function(){}); } //ScrubBodymovinTimeline(anim) </script> <style type="text/css"> body {  background-color: #111;  overflow: hidden;  text-align: center; } body, html {  height: 100%;  width: 100%;  margin: 0;  padding: 0; } #animationWindow {  width: 100%;  height: 100%; } .stripeFill {  fill:#FF0000 !important; } </style> <div id="animationWindow"> </div>

Đây là demo

Bài đăng đã hết chào các bạn

6 bình luận

Hãy cùng tham gia bình luận về bài viết này nhé!

  1. - Thank kiu <3 thằng e nha :p

    ReplyDelete
  2. hà qua trả tt cho thảo nè,rảnh thảo qua blog tôi nhé,ms ra bài mới

    ReplyDelete
    Replies
    1. oke bây giờ qua luôn nè :D

      Delete
  3. Replies
    1. haha then kiu ông nha , ông lại die r à :((

      Delete
CÓ THỂ BẠN ĐANG TÌM
  • GOOGLE ADSENSE LÀ GÌ? CÁCH TÍNH/TRẢ TIỀN CỦA GOOGLE ADSENSE
    GOOGLE ADSENSE LÀ GÌ? CÁCH TÍNH/TRẢ TIỀN CỦA GOOGLE ADSENSE
    26/08/2018 - 0 bình luận
    1.GOOGLE ADSENSE LÀ GÌ? Các bạn cứ hiểu đơn giản Google Adsense như là một bộ phận trong trung tâm g…
  • TUT DAME APPS NGUYÊN THỦY BẰNG PAGE - BY NHỮ ĐỨC THẮNG
    TUT DAME APPS NGUYÊN THỦY BẰNG PAGE - BY NHỮ ĐỨC THẮNG
    11/09/2018 - 0 bình luận
    TẢN MẠN Hello, Xin Chào tất cả các bạn !!! Mình là Nguyễn Phương Thảo đây :) Chắc hẳn cũng có bạn đã biế…
  • CHIA SẺ TEMPLATE PRO VITAMIN ADMIN THẢO BLOG EDIT
    CHIA SẺ TEMPLATE PRO VITAMIN ADMIN THẢO BLOG EDIT
    16/11/2018 - 20 bình luận
    Hôm nay buồn nên thay template mới nên chia sẽ cho ae một template khá đẹp mắt load rất oke ^^  ƯU…
  • Hướng dẫn tăng Like Facebook cực nhanh và an toàn
    Hướng dẫn tăng Like Facebook cực nhanh và an toàn
    12/08/2018 - 0 bình luận
    Tăng Like Facebook ? Tăng Like Facebook đang là hiện tượng chưa bao giờ hết HOT. Hiện nay, một số người đang …
  • [PSD ẢNH BÌA] Ngôn Tình Chất
    [PSD ẢNH BÌA] Ngôn Tình Chất
    15/01/2018 - 0 bình luận
    DOWNLOAD
  • Hướng dẫn Verified dấu tick xanh cho Page và trang cá nhân Facebook
    Hướng dẫn Verified dấu tick xanh cho Page và trang cá nhân Facebook
    05/10/2018 - 10 bình luận
    Chào các bạn, dấu tick xanh được Facebook sử dụng để đánh dấu những trang đã xác thực. Nghĩa là nhưng danh h…
  • HƯỚNG DẪN TẠO WIDGET THEO DÕI CỰC ĐẸP CHO BLOGSPOT
    HƯỚNG DẪN TẠO WIDGET THEO DÕI CỰC ĐẸP CHO BLOGSPOT
    18/08/2018 - 0 bình luận
    Đến hẹn lại lên hôm nay mình xin chia sẻ ae một widget nho nhỏ giúp làm đẹp blog của bạn. CÁCH TH…
  • Cách Unlock Nick Facebook Bị Checkpoint 72h Bằng Link Contact 890
    Cách Unlock Nick Facebook Bị Checkpoint 72h Bằng Link Contact 890
    14/09/2018 - 3 bình luận
    Chào các bạn cũng khá là lâu rồi mình không ra bài viết về thủ thuật facebook, hôm nay ở bài viết này mình sẽ …
  • TUT DAME 167 FAQ SEX
    TUT DAME 167 FAQ SEX
    15/04/2019 - 5 bình luận
    TUT Dame FAQ 167 5s - Yêu cầu Account victim phải có ít nhất 1 bài viết hoặc 1 cmt + B1 : Fake ip sang đức, …
  •  Chiêm ngưỡng Photoshop phiên bản được Redesign chất lừ
    Chiêm ngưỡng Photoshop phiên bản được Redesign chất lừ
    27/08/2018 - 0 bình luận
    Redesign là một thuật ngữ khá thân thuộc trong thiết kế, đặc biệt là trong thiết kế đồ họa và website. Hiểu ngắ…
  • Share psd giấy chứng tử, giấy báo tử người đã chết cho facebook BY: NGUYỄN TỈNH BLOG
    Share psd giấy chứng tử, giấy báo tử người đã chết cho facebook BY: NGUYỄN TỈNH BLOG
    23/12/2018 - 9 bình luận
    Chào các bạn, có vẻ dạo gần đây dame tưởng nhớ đang trở nên hot lại. Để dame được tưởng nhớ thì chúng ta cần 1 …
  • TUT DAME FAQ 13T BẰNG LINK 051 RA DẠNG 208 MỚI NHẤT
    TUT DAME FAQ 13T BẰNG LINK 051 RA DẠNG 208 MỚI NHẤT
    18/10/2018 - 2 bình luận
    Chào các bạn, dạo gần đây thì lại nỗi lên tut dame faq 13t bằng link 051. Dạng này thì đã  ra rất lâu từ…