Copy from input
The global Code for all the clipboards is new Clipboard('.btn');
<div class="clipboard"> <form class="form-horizontal"> <input type="text" class="form-control mb-4" id="input-copy" value="http://www.admin-dashboard.com"> <a class="mb-1 btn btn-primary" href="javascript:;" data-clipboard-action="copy" data-clipboard-target="#input-copy"><svg> ... </svg> Copy from Input</a> <a class="mb-1 btn btn-dark" href="javascript:;" data-clipboard-action="cut" data-clipboard-target="#input-copy"><svg> ... </svg> Cut from Input</a> </form> </div>
Copy from Text Area
<div class="clipboard"> <form class="form-horizontal"> <textarea class="form-control mb-4" rows="3" id="textarea-copy">Lorem ipsum dolor sit amet, consectetur adipiscing elit...</textarea> <a class="mb-1 btn btn-primary" href="javascript:;" data-clipboard-action="copy" data-clipboard-target="#textarea-copy"><svg> ... </svg> Copy from Input</a> <a class="mb-1 btn btn-dark" href="javascript:;" data-clipboard-action="cut" data-clipboard-target="#textarea-copy"><svg> ... </svg> Cut from Input</a> </form> </div>
Copy Text from Paragraph
<div class="clipboard copy-txt"> <p class="otp-pass">Here is your OTP <span id="paragraph-copy1">22991</span>.</p> <p class="mb-4">Please do not share it to anyone</p> <a class="mb-1 btn btn-primary" href="javascript:;" data-clipboard-action="copy" data-clipboard-target="#paragraph-copy1"><svg> ... </svg> Copy from Input</a> </div>
Copy Hidden Text (Advanced)
<div class="clipboard copy-txt"> <p class="mb-4">Link -> <span id="advanced-paragraph">http://www.admin-dashboard.com/code</span></p> <a class="mb-1 btn btn-primary" href="javascript:;" data-clipboard-action="copy" data-clipboard-target="#advanced-paragraph"><svg> ... </svg> Copy Link</a> <a class="mb-1 btn btn-warning" href="javascript:;" data-clipboard-action="copy" data-clipboard-text="2291"><svg> ... </svg> Copy Hidden Code</a> </div>
Copyright © 2021 DesignReset, All rights reserved.
Coded with