Create sticky (fixed) social media floating icon on right side of page using CSS

RichardSa
 
on Jul 06, 2021 05:28 AM
2407 Views

Create static WhatsApp link on web page

I have an image that shows green WhatsApp link on the right-side of the webpage, where users can click and it will redirect them.

The link will be fixed when the web page is scrolled.

Some of these links are either in circular shape.

Download FREE API for Word, Excel and PDF in ASP.Net: Download
dharmendr
 
on Jul 06, 2021 05:34 AM
on Jul 06, 2021 05:35 AM

Hi RichardSa,

Refer below code.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <div id="MovingDiv" style="position: fixed; top: 50%; right: 10px;background-color:#00C216;color:#fff;">
        Reach Us Via Whatsapp
    </div>
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
    I like aspforums.net
    <br />
</body>
</html>

Demo