I need help from expert about copy to clipboard code

https://fontawesome.com/icons/copy . In this link theres a option “COPY HTML” <i class="fas fa-copy"></i> WHERE if i touched the text line it will be copied.. And show me a tooltext bar. I need this code brother. Can you help me? If you cant understand my words. Simply go to the link https://fontawesome.com/icons/copy Select a icon. Then try to copy it. Can anyone tell copy to clipboard like fontawesome? please share how to make button when we click on it automatically text get copied. In simple word. I need this copy to clipboard code. Im noob in coding. can anyone help me out? 😥 Thanks brother. ❤

web js expert sourcecode clipboard

28th Aug 2020, 8:39 PM

Ahmad Talha

7 Answers

+ 5

For your icon, try "fa fa-copy" instead of "fas fa-copy" in case you have a different version of Font Awesome. The Font Awesome CDN I just looked at from https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css doesn't define "fas". "fas" is short for Font Awesome Solid and maybe you're linking to a different kind of Font Awesome. For the copying to work, have you tried something like this? https://www.w3schools.com/howto/howto_js_copy_clipboard.asp The basic steps would be: 1. Bind click on your button to a function. 2. Make the function do the following: 1. Get your input or textarea element from the document. For example, var element = document.getElementById("myInput"); 2. Select all text in it. For example, element.select(); element.setSelectionRange(0, 99999); 3. Run: document.execCommand("copy");

28th Aug 2020, 9:17 PM

Josh Greig

+ 2

Ahman wrote " i Don't here for fa fa copy code. Im here for the code of touch and copy to clipboard. read my question again" There is a rough answer to that too after the font awesome comments. Here is a completely working implementation: <!DOCTYPE html> <html lang="en"> <head> <title>Copy to clipboard example</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css "> <script> document.addEventListener('DOMContentLoaded', function() { document.getElementById('copy').addEventListener('click', function() { var contentElement = document.getElementById('content-to-copy'); contentElement.select(); contentElement.setSelectionRange(0, 99999); document.execCommand("copy"); }); }); </script> </head> <body> <label for="content-to-copy">Content</label> <textarea id="content-to-copy">Hello World</textarea> <button id="copy" class="fa fa-copy"></button> </body> </html>

29th Aug 2020, 2:39 PM

Josh Greig

+ 1

If i understand right you wanna code what enable user to copy text whan click on it. Maybe this can help you https://www.30secondsofcode.org/blog/s/copy-text-to-clipboard-with-javascript

28th Aug 2020, 9:59 PM

PanicS

I saw this one. But i like something beautiful. Its not about fas fa copy or fa fa copy. . In there site(fontawesome) i touched the HTML line and its copied to clipboard. but in w3schools theres button to copy and theres a textarea too. Brother i need the design not the concept. Hope you understood.

28th Aug 2020, 9:25 PM

Ahmad Talha

isee. most likely you use fontawesome 5 format, while using fontawesome 4 css link/import. solution 1. change fas fa-copy to fa fa-copy, and use font awesome cdn from Josh Greig solution 2. change the css import to fontawesome 5, there are free version available from cdnjs

28th Aug 2020, 10:40 PM

Rei

Bro... You Didn't got the point. i Don't here for fa fa copy code. Im here for the code of touch and copy to clipboard. read my question again. 😥

29th Aug 2020, 12:38 PM

Ahmad Talha

ooooh okay, i have a template to work with. in my profile the code Image Upload Helper. its in the line 41, its quite long but has fallback if the copy to clipboard method isnt working, you can ignore Swal.fire those are just an alert

29th Aug 2020, 1:38 PM

Rei