Advertisement
Crazykk1449

HTML Copy Text Button Code

Mar 24th, 2017
114
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 2.10 KB | None | 0 0
  1. <style>
  2. .myButton {
  3.     -moz-box-shadow:inset 0px 1px 0px 0px #f5978e;
  4.     -webkit-box-shadow:inset 0px 1px 0px 0px #f5978e;
  5.     box-shadow:inset 0px 1px 0px 0px #f5978e;
  6.     background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24537), color-stop(1, #c62d1f));
  7.     background:-moz-linear-gradient(top, #f24537 5%, #c62d1f 100%);
  8.     background:-webkit-linear-gradient(top, #f24537 5%, #c62d1f 100%);
  9.     background:-o-linear-gradient(top, #f24537 5%, #c62d1f 100%);
  10.     background:-ms-linear-gradient(top, #f24537 5%, #c62d1f 100%);
  11.     background:linear-gradient(to bottom, #f24537 5%, #c62d1f 100%);
  12.     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#c62d1f',GradientType=0);
  13.     background-color:#f24537;
  14.     -moz-border-radius:6px;
  15.     -webkit-border-radius:6px;
  16.     border-radius:6px;
  17.     border:1px solid #d02718;
  18.     display:inline-block;
  19.     cursor:pointer;
  20.     color:#ffffff;
  21.     font-family:Arial;
  22.     font-size:15px;
  23.     font-weight:bold;
  24.     padding:6px 24px;
  25.     text-decoration:none;
  26.     text-shadow:0px 1px 0px #810e05;
  27.     font-color: white;
  28. }
  29. .myButton:hover {
  30.     background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, #f24537));
  31.     background:-moz-linear-gradient(top, #c62d1f 5%, #f24537 100%);
  32.     background:-webkit-linear-gradient(top, #c62d1f 5%, #f24537 100%);
  33.     background:-o-linear-gradient(top, #c62d1f 5%, #f24537 100%);
  34.     background:-ms-linear-gradient(top, #c62d1f 5%, #f24537 100%);
  35.     background:linear-gradient(to bottom, #c62d1f 5%, #f24537 100%);
  36.     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24537',GradientType=0);
  37.     background-color:#c62d1f;
  38. }
  39. .myButton:active {
  40.     position:relative;
  41.     top:1px;
  42.     font-color: white;
  43. }
  44. </style>
  45. <script>
  46. function copyToClipboard(element) {
  47.   var $temp = $("<input>");
  48.   $("body").append($temp);
  49.   $temp.val($(element).text()).select();
  50.   document.execCommand("copy");
  51.   $temp.remove();
  52. }
  53. </script>
  54. <center>
  55.  
  56. <a href="#copied" class="myButton" onclick="copyToClipboard('#sentence')">Copy Test</a>
  57. <br></br>
  58. <p id="sentence">This is a sentence.</p>
  59.  
  60. </center>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement