<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="report-popup"> <i class="fa fa-times close-btn"></i> <a href="#download-form" data-toggle="modal"><img class="img-responsive" src="images/Benchmark-Popup.jpg" alt="" /></a> </div>

.report-popup{ position: fixed; bottom:-500px; right: 0px; z-index: 9999; } .close-btn{ font-size: 18px; color: #fff; background: #000; padding: 10px; position: absolute; right: 0px; top: 0px; z-index: 99999; cursor: pointer; }

$(document).ready(function(){ if ($(window).width() > 767) { function openpopup() { setTimeout(function() { $('.report-popup').animate({bottom: '0px'},"") //.delay(15000).animate({bottom: '-1000px'}); }, 500); } function closepopup() { $(document).on("click", ".close-btn", function () { $('.report-popup').animate({bottom: '-1000px'}); }); } function closepopup_auto() { setTimeout(function() { $('.report-popup').animate({bottom: '-1000px'}); }, 10000); } openpopup(); closepopup(); closepopup_auto(); } })