Sticky Bottom Social Bar When Scrolling Down - jQuery SlideUp Social

SlideUp Social is a small yet useful jQuery plugin created for increasing your social media followers with a sticky social bar.

The plugin automatically generates a sticky social bar that will always stick to the bottom as you scroll down the page.

The plugin will randomly select a social media network to display in the social bar each time you scroll down the web page.

Currently supports Facebook, Twitter, and Instagram.

How to use it:

1. Include the jQuery SlideUp Social plugin's files on the web page.

<link rel="stylesheet" href="css/slideup-social.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js" 
        integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" 
        crossorigin="anonymous">
</script>
<script src="js/slideup-social.js"></script>

2. Create the HTML for the social bar.

<div class="float-banner nav-down">
  <div class="float-container">
    <div class="float-row">
      <div class="floar-banner-wrap">
        <div class="btn-close" id="btn-close">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40" enable-background="new 0 0 40 40">
            <line x1="5" y1="5" x2="35" y2="35" stroke="#fff" stroke-width="3" stroke-linecap="round"
              stroke-miterlimit="10"></line>
            <line x1="35" y1="5" x2="5" y2="35" stroke="#fff" stroke-width="3" stroke-linecap="round"
              stroke-miterlimit="10"></line>
          </svg>
        </div>
      </div>
    </div>
  </div>
</div>

3. Call the plugin on the top container and done.

$(function () {
  $('.float-banner').floatbanner();
});

4. Enable/disbale social media networks.

$(function () {
  $('.float-banner').floatbanner({

    // social name
    socialName: ['facebook', 'twitter', 'instagram'],

    // user name
    userName: ['jqueryscript', 'jqueryscript', 'jqueryscript'],

    // social link
    socialUrl: ['http://fb.com/jqueryscript', 'http://twitter.com/jqueryscript', 'http://instagram.com/jqueryscript']
    
  });
});

About Author:

Author: Fahem Ahmed

Website: https://github.com/f4h3m/f4-slideup-social

---

This awesome jQuery plugin is developed by f4h3m. For more Advanced Usages, please check the demo page or visit the official website.