maltepe escort ataşehir escort

Basit Html Whatsapp Buton Kodu:

Serap

Moderatör
Platin
Ad Soyad
S***** B****
Mesajlar
35
Beğeni
7
Nereden
Tekirdağ
Ticaret
0 (0%)
1531045504.png

HTML:

Kod:
<div id="wp_btn_trwp">
    <div class="wpbtna">
        <a href="https://wa.me/90" target="_blank" class="wpbtndiv">
            <div class="wpbtntxt">Merhaba, nasıl yardımcı olabilirim?</div>
        </a>
        <a href="https://wa.me/90" target="_blank" color="#4dc247" class="wpbtnsvg">
            <svg viewBox="0 0 32 32" style="width: 100%; height: 100%; fill: rgb(255, 255, 255); stroke: none;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                <path d="M19.11 17.205c-.372 0-1.088 1.39-1.518 1.39a.63.63 0 0 1-.315-.1c-.802-.402-1.504-.817-2.163-1.447-.545-.516-1.146-1.29-1.46-1.963a.426.426 0 0 1-.073-.215c0-.33.99-.945.99-1.49 0-.143-.73-2.09-.832-2.335-.143-.372-.214-.487-.6-.487-.187 0-.36-.043-.53-.043-.302 0-.53.115-.746.315-.688.645-1.032 1.318-1.06 2.264v.114c-.015.99.472 1.977 1.017 2.78 1.23 1.82 2.506 3.41 4.554 4.34.616.287 2.035.888 2.722.888.817 0 2.15-.515 2.478-1.318.13-.33.244-.73.244-1.088 0-.058 0-.144-.03-.215-.1-.172-2.434-1.39-2.678-1.39zm-2.908 7.593c-1.747 0-3.48-.53-4.942-1.49L7.793 24.41l1.132-3.337a8.955 8.955 0 0 1-1.72-5.272c0-4.955 4.04-8.995 8.997-8.995S25.2 10.845 25.2 15.8c0 4.958-4.04 8.998-8.998 8.998zm0-19.798c-5.96 0-10.8 4.842-10.8 10.8 0 1.964.53 3.898 1.546 5.574L5 27.176l5.974-1.92a10.807 10.807 0 0 0 16.03-9.455c0-5.958-4.842-10.8-10.802-10.8z"></path>
            </svg>
        </a>
    </div>
</div>

CSS:

Kod:
#wp_btn_trwp {
    bottom: 21px;
    left: 23px;
    opacity: 1;
    transition: opacity 0.5s ease 0s;
    box-sizing: border-box;
    position: fixed !important;
    z-index: 16000160 !important;
    direction: ltr;
    box-sizing: border-box !important;
}
.wpbtna {
    display: flex;
    margin-top: 14px;
    position: relative;
    -moz-box-pack: start;
    justify-content: flex-start;
}
.wpbtndiv {
    transform: translateX(0px);
    position: relative;
    animation-duration: 0.64s;
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-delay: 0.16s;
    animation-fill-mode: backwards;
    animation-name: ijMbJr;
    box-shadow: rgba(0, 0, 0, 0.1) 2px 2px 13px;
    border: 1px solid rgb(226, 226, 226);
    border-radius: 5px;
    background: white none repeat scroll 0% 0%;
    text-decoration: none !important;
    color: rgb(0, 0, 0) !important;
    cursor: pointer;
    margin: auto auto auto 31px;
    max-width: 155px;
    max-height: 44px;
    display: flex;
    order: 2;
}
.wpbtndiv {
    color: rgb(0, 0, 0) !important;
    cursor: pointer;
}
.wpbtndiv {
    color: rgb(0, 0, 0) !important;
    cursor: pointer;
}
.wpbtndiv::after {
    content: "";
    position: absolute;
    background: white none repeat scroll 0% 0%;
    border-top: 1px solid rgb(226, 226, 226);
    border-left: 1px solid rgb(226, 226, 226);
    left: -5px;
    top: 50%;
    margin-top: -4px;
    width: 8px;
    height: 8px;
    z-index: 1;
    transform: rotate(-45deg);
}
.wpbtnsvg {
    width: 50px;
    height: 50px;
    background: rgb(77, 194, 71) none repeat scroll 0% 0% !important;
    order: 1;
    padding: 5px;
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.4) 2px 2px 6px;
    transition: all 0.5s ease 0s;
    position: relative;
    z-index: 200;
    display: block;
    border: 0px none;
}
.wpbtntxt {
    text-align: center;
    padding: 7px 10px;
    line-height: 14px;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
    font-size: 14px;
    margin: auto;
}
 

Şu anda bu konu'yu okuyan kullanıcılar

Benzer konular

Anasayfa Kayıt Ol Giriş Yap
Üst