ওয়েবসাইটে WhatsApp / Telegram ফ্লোটিং বাটন অ্যাড করার কোড
নিচে 👇👇 দেওয়া কোডটি কপি করুনঃ
<!--Code Start-->
<a href="www.whatapp.com" class="float" target="_blank" rel="noopener">
<i class="fa fa-whatsapp"></i>
<img width="36px" height="30px" class="center" src="https://cdn.pixabay.com/photo/2021/12/27/10/50/telegram-icon-6896828_1280.png" />
<span class="float-text">Join Our Telegram Channel!</span>
</a>
<style>
.float {
position: fixed;
width: 55px;
height: 55px;
bottom: 30%;
margin-bottom: -50px;
right: 10px;
color: white !important;
background-color: #128c7e;
border-radius: 100px;
display: flex;
text-decoration: none;
justify-content: center;
align-items: center;
font-size: 45px;
box-shadow: 2px 2px 3px #999;
z-index: 100;
animation: shake 13s infinite;
}
.fa-whatsapp {
font-family: FontAwesome;
}
.float-text {
position: absolute;
left: -195px;
top: 13px;
font-size: 15px;
font-weight: bold;
background: #128c7e;
padding: 5px 10px;
border-radius: 3px;
color: #ffffff;
}
@keyframes shake {
0% {}
35% {
transform: scale(1.0);
}
42% {
transform: scale(.8);
}
45% {
transform: rotate(0deg) scale(1.2);
}
46% {
transform: rotate(-40deg) scale(1.2);
}
47% {
transform: rotate(40deg) scale(1.2);
}
48% {
transform: rotate(-40deg) scale(1.2);
}
49% {
transform: rotate(40deg) scale(1.2);
}
50% {
transform: rotate(-20deg) scale(1.2);
}
51% {
transform: rotate(0deg) scale(1.2);
}
61% {
transform: scale(1.0);
}
100% {}
}
@keyframes shakey {}
</style>
<!--Code End-->
