I am looking to add a button such as "call me" on my website, adding it on the right bottom. I need this button to always follow visitor when visitor scroll up and down... Sort like the zopim chat box that integrate in a website, but I just need a simple button
I am using this html code. You need to do any changes. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://lajkovi.webuda.com/js/jquery.cycle.all.2.72.js"></script> <script type="text/javascript" src="http://lajkovi.webuda.com/js/jquery.easing.1.1.1.js"></script> <script type="text/javascript" src="http://lajkovi.webuda.com/js/fbslidebox.js"></script> <!-- Start--> <div style='position:fixed; z-index:10; width:342px; overflow:hidden; bottom:50px; right:10px; display:none; background:url(http://like-pro.com/images/bottom-lead-bg.png) repeat; -moz-border-radius:15px; -webkit-border-radius:15px; border-radius:15px; border:1px solid #000000;' id='fbslidebox'> <div style='width:320px; padding:10px; margin:0 auto; overflow:hidden;'> <a href='#' style='float:right; color:#999; padding:0 3px; border:1px solid #CCC; text-decoration:none; font-size:9px; font-family:Verdana, Geneva, sans-serif;' id='fbcloseslidebox'>X</a> <strong style='color:#ab0203;'>Contact me</strong> <br/> <iframe ></iframe> </div> </div> <!-- START (hidden counter)--> Code (markup):
What is the button supposed to DO, once clicked? If all you want is a button fixed to the lower right corner, you don't need any javascript or anything like that, you just need a little bit of HTML and CSS: HTML: <form id="callmeform" method="post" action="file_to_load_on_click.something"> <input type="submit" value="Call me"> </form> Code (markup): CSS: #callmeform { position: fixed; bottom: 0.5em; right: 0.5em; } #callmeform input { background: green; border-radius: 1em; width: 5em; height: 3em; color: white; border: 2px solid black; } Code (markup): Example jsfiddle: https://jsfiddle.net/3zzLue9a/ This can of course be styled as you want, and it will stay in that position always.