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
- Thank kiu <3 thằng e nha :p
ReplyDeletehà qua trả tt cho thảo nè,rảnh thảo qua blog tôi nhé,ms ra bài mới
ReplyDeleteoke bây giờ qua luôn nè :D
Deletengầu á :p
ReplyDeletehaha then kiu ông nha , ông lại die r à :((
Deleteừm !! :(((
Delete