Chào mừng!

Bằng cách đăng ký với chúng tôi, bạn sẽ có thể thảo luận, chia sẻ và nhắn tin riêng tư với các thành viên khác trong cộng đồng của chúng tôi.

Đăng ký ngay!
  • Diễn Đàn VuiCode tạm thời chuyển xang tên miền mới là DienDanIT.NET. Bạn hãy truy cập bằng tên miền mới nhé!

Share Code ông già Noel

TTB

Tham gia
4/11/18
Bài viết
31
Lượt Thích
9
VNĐ
0
VNĐ
0
Chào các member
Bạn không có quyền xem liên kết này Đăng nhập hoặc Đăng ký.
hôm nay mình sẽ hướng dẫn cách bạn tạo Code ông già Noel cho trang web trông cực cute :3

HƯỚNG DẪN CÁCH LÀM
Bước 1:
Tiến hành vào Dashboard tìm thẻ </head> và thêm đoạn mã này lên nó (bước này để thêm thư viện Jquery cho trang)
[HIDEREPLY]
HTML:
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
[/HIDEREPLY]
Bước 2: Tìm thẻ </body> và thêm đoạn code dưới lên trên thẻ vừa tìm đc
[HIDEREPLY]
HTML:
<!-- Noel -->
<style type='text/css'>
.clssimg,.clss2{opacity:0;animation-name:bounceIn;animation-duration:450ms;animation-timing-function:linear;animation-fill-mode:forwards}.clssimg{animation-delay:2s;cursor:pointer}
.clss2{animation-delay:3s}@keyframes bounceIn{0%{opacity:0;transform:scale(0.3) translate3d(0,0,0)}50%{opacity:.9;transform:scale(1.1)}80%{opacity:1;transform:scale(0.89)}100%{opacity:1;transform:scale(1) translate3d(0,0,0)}}@media(min-width:320px) and (max-width:480px){.clssimg{width:60px}.nochatbot{bottom:58px!important;right:50px!important;width:22px!important;height:22px!important;padding:0!important}.modal-content{right:-24px!important;width:19rem!important;bottom:-20px!important}#animate{right:90px!important;bottom:60px!important}}.modal{position:fixed;z-index:999;right:-120px;bottom:53px;opacity:0;visibility:hidden;transform:scale(1.1);transition:visibility 0s linear .25s,opacity .25s 0s,transform .25s}.modal-content{position:absolute;bottom:80px;right:200px;background-color:white;padding:12px;width:24rem;border-radius:12px;box-shadow:0 1pt 12pt rgba(0, 0, 0, .15)}.close-button{float:left;width:18pt;height:24px;line-height:21px;text-align:center;cursor:pointer;border-radius:1.25rem;background-color:lightgray;font-size:20px;font-weight:900;font-family:georgia}.show-modal{opacity:1;visibility:visible;transform:scale(1.0);transition:visibility 0s linear 0s,opacity .25s 0s,transform .25s}.noidungchat{margin-top:-20px;padding-left:38px;padding-top:20px;width:77%;font-family:&#39;Roboto&#39;,sans-serif;font-size:17px;color:#000}.trochuyenngay{font-size:18px;font-weight:400;text-align:center;font-family:sans-serif;width:160.5%;float:left;border-top:.75pt solid rgba(0,0,0,.1);margin:0 -50px;margin-top:10px;padding-top:10px;box-sizing:border-box}.trochuyenngay a{color:rgb(51, 122, 183)}.iconchat{position:absolute;right:15px}.popupchat{position:fixed;bottom:-6px;right:16px}.iconchat img{border-radius:100%}.nochatbot{background:red;width:29px;color:white;border-radius:50px;padding:4px;font-size:11px;right:80px;bottom:93px;position:fixed;text-align:center}.animated.faster{-webkit-animation-duration:.5s;animation-duration:.5s}.animated{-webkit-animation-duration:1s;-webkit-animation-fill-mode:both;animation-duration:1s;animation-fill-mode:both}@-webkit-keyframes bounceOutRight{20%{-webkit-transform:translate3d(-20px,0,0);opacity:1;transform:translate3d(-20px,0,0)}to{-webkit-transform:translate3d(2000px,0,0);opacity:0;transform:translate3d(2000px,0,0)}}@keyframes bounceOutRight{20%{-webkit-transform:translate3d(-20px,0,0);opacity:1;transform:translate3d(-20px,0,0)}to{-webkit-transform:translate3d(2000px,0,0);opacity:0;transform:translate3d(2000px,0,0)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{-webkit-transform:translate3d(3000px,0,0);opacity:0;transform:translate3d(3000px,0,0)}60%{-webkit-transform:translate3d(-25px,0,0);opacity:1;transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{-webkit-transform:translate3d(3000px,0,0);opacity:0;transform:translate3d(3000px,0,0)}60%{-webkit-transform:translate3d(-25px,0,0);opacity:1;transform:translate3d(-25px,0,0)}75%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}90%{-webkit-transform:translate3d(-5px,0,0);transform:translate3d(-5px,0,0)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}.speech-bubble{position:relative;padding:20px;z-index:99}.speech-bubble:after{content:&#39;&#39;;position:absolute;right:0;top:50%;width:0;height:0;border:10px solid transparent;border-left-color:#0083fe;border-right:0;margin-top:15px;margin-right:-9px}span#x{color:white;font-family:&#39;Open Sans&#39;,sans-serif;padding:10px;background:#0083fe;position:absolute;border-radius:5px;right:0;top:50%}#animate{display:none;position:fixed;right:120px;bottom:80px;width:100%;
</style>
<div class='popupchat trigger'>
<a href='https://www.facebook.com/iambinhsliver' rel='nofollow'><img class='clssimg' height='auto' src='https://www.qoobee.com/wp-content/uploads/2018/11/qoobee-christmas-emoticon.gif' width='auto'/></a>
<div class='nochatbot clss2'><script>document.write(Math.ceil(Math.random()*10)+2)</script></div></div>
<script type='text/javascript'>
//<![CDATA[
var modal=document.querySelector(".modal");var trigger=document.querySelector(".trigger");var closeButton=document.querySelector(".close-button");function toggleModal(){modal.classList.toggle("show-modal");}
function windowOnClick(event){if(event.target===modal){toggleModal();}}
trigger.addEventListener("click",toggleModal);closeButton.addEventListener("click",toggleModal);window.addEventListener("click",windowOnClick);
//]]>
</script>
<script type='text/javascript'>
/*<![CDATA[*/var x=document.getElementById('x');s=['Xin chào!','Bạn đã có người yêu chưa','Nếu chưa thì lo kiếm người yêu đi nhé','Sặp đện Noel rội đọ :3'];var times=0;let delayTime=8*1000;const run=function loop(){jQuery('#animate').css('display','block')
var loops=setTimeout(loop,3000);if(times==4){clearTimeout(loops);jQuery('#animate').addClass('bounceOutRight faster');}
else{s.length&&(x.innerHTML=s.shift(),loops);setTimeout(function(){jQuery('#animate').removeClass('bounceInRight faster');},2000);jQuery('#animate').addClass('bounceInRight faster');}
times++;return false;};setTimeout(run,delayTime);
/*]]>*/
</script>
[/HIDEREPLY]
Chúc bạn thành công!
Code được tách từ trang web:
Bạn không có quyền xem liên kết này Đăng nhập hoặc Đăng ký.
và được chỉnh sửa lại vài thứ.
 
Sửa lần cuối bởi điều hành viên:
Tham gia
5/11/18
Bài viết
260
Lượt Thích
270
VNĐ
804
VNĐ
804
bên em nhận tăng mắt live và share vào gr fb tăng doanh thu bán hàng. cần lh e nhé
 
  • Like
Cảm xúc: TTB
Tham gia
5/11/18
Bài viết
88
Lượt Thích
10
VNĐ
31
VNĐ
31
ước share templates
 
Tham gia
17/11/18
Bài viết
63
Lượt Thích
7
VNĐ
466
VNĐ
466
vip <3
 
  • Like
Cảm xúc: TTB
Tham gia
15/11/18
Bài viết
17
Lượt Thích
2
VNĐ
0
VNĐ
0
thanks nhé <3
 
  • Like
Cảm xúc: TTB

Bài mới nhất

Top Bottom