1

NPM - Meet my friend paul 👨‍🦰 👨‍🦰

 3 years ago
source link: https://dev.to/luctst/npm-meet-my-friend-paul-3jo1
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Make Paul appear on your page when you click

I have a friend called Paul, he loves beer and he works hard everyday, so I decided to honor him with this little package each time you'll click on a DOM element my friend Paul will appear randomly on your web page :) Enjoy !!

it is him 👇

Install 🚀

Use Paul via a CDN by including this script:

Add this script just before your </body> closing tag:

<script crossorigin src="https://unpkg.com/@luctst/paul/umd/paul.client.min.js"></script>
Enter fullscreen modeExit fullscreen mode

You now have access to the Paul() function to see how to use it check the api section below.

Example 🖍 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Hi Paul 👨‍🦰</title>
</head>
<body>
    <script crossorigin src="https://unpkg.com/@luctst/paul/umd/paul.client.min.js"></script> 
    <script>
        Paul();
    </script> 
</body>
</html>
Enter fullscreen modeExit fullscreen mode

API 🧑

Paul([DOMElement], [friends])

The Paul function create an img with my friend Paul.

  • DOMElement {HTMLElement, optional} - If this argument is specified the click event will be attached on this DOM Element.
  • friends {Array, optional} - If this argument is specified the function will display randomly an img from the friends array.

Contribute 🍰

If you want to add other pictures, please do not hesitate to PR some pictures in this folder https://github.com/luctst/paul/tree/master/static

Happy coding ✨ 🦄


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK