Mettere un pulsante Copia negli Appunti in una pagina Web: 5 passaggi (con immagini)

Sommario:

Passaggio 1: crea una penna
Passaggio 2: aggiungi riferimenti
Passaggio 3: codice
Passaggio 4: modifica del codice in base alle proprie esigenze
Passaggio 5: dimostrazione

2025 Autore: John Day | [email protected]. Ultima modifica: 2025-01-13 06:57

Inserimento di un pulsante Copia negli Appunti in una pagina Web

Può sembrare semplice, e potrei sembrare sciocco per averlo messo su Instructables, ma in realtà non è così facile. C'è CSS, Jquery, HTML, qualche javascript fantasioso e, vabbè, lo sai.

Passaggio 1: crea una penna

C'è questo bel sito chiamato Codepen. In passato, solo per codificare in HTML, dovevo farlo

Avvia Esplora file.
Vai a I miei documenti.
Crea un file txt.
Rinominare quel file in "MyHTMLDoc.html".
Premi OK nella finestra di dialogo di avviso.
Chiudi Esplora file.
Apri Visual Studio, che richiede cinque minuti.
Aprire il file in Visual Studio, che richiede altri cinque minuti. VS è molto lento.
Cominciare.
Al termine, devo aprire il file in Edge per visualizzare il mio lavoro.

Ora, tutto ciò che devi fare è

Avvia Edge.
Vai su
Nell'angolo in alto a destra, premi Nuova penna.
Inizia a codificare.

Vedi quanto è più facile? Inserisci semplicemente JS, CSS e HTML nelle rispettive caselle. I risultati vengono visualizzati automaticamente sulla destra.

In effetti, Codepen è davvero molto meglio, che ti consiglio di creare il tuo account in questo momento. Sì, odio essere l'unico a fare pubblicità, ma non posso farci niente. È molto meglio. Non ci posso fare niente.

Oppure, se non vuoi creare un account, puoi creare una penna senza account. Puoi salvare la tua penna con il nome utente "Capitano anonimo".

Passaggio 2: aggiungi riferimenti

Dato che utilizzeremo Jquery e questa cosa (davvero) interessante chiamata "Balloon.css", dobbiamo prima aggiungere i riferimenti. Se sei nuovo, ti dirò come farlo in Codepen.

Fare clic su Impostazioni.
A seconda che il riferimento sia un foglio di stile o uno script, fare clic su CSS o Javascript.
In Aggiungi esterno (Javascript o CSS) aggiungi i riferimenti.

Aggiungere:

bla bla bla: BLAAAAAAA!!!!

Ora rimuovilo e inserisci il tag HTML che collega al tuo CDN preferito per Jquery e Balloon.css.