thanos-end-game

    1.0.0 • Public • Published

    thanos-snap

    A custom web component to make your html element disappear with one snap of thanos. But unlike thanos power, this componentdoes not bring back the dead. Use it wisely. :)

    Hover gif

    Installation

    Install via npm:

    $ npm install thanos-snap

    Usage

    To use thanos-snap in your website, just add the thanos.min.js into your document's <head>. That's it! You've thanos power now. Please use it wisely.

    Add the custom component tag, give the id of the object and of the weapon. For example:

    <thanos-snap object='iron-man' weapon='thumb'> </thanos-snap>

    In the above component iron-man and thumb are id given to the div and the button respectively.

    <div id='iron-man' class="iron-man mt-4">
        <img src="iron-man.png" />
    </div>
    <button id='thumb'>Snap</button>

    Adding js file to your page

    <script src="thanos.min.js"></script>

    or use a CDN version by jsDelivr

    You need to add the css as well to make pixel effect work properly

    .dust {
        position: absolute;
      }
      * {
          margin: 0px;
          overflow-x: hidden;
      }
    .iron-man {
        display: inline-block;
    }
    You can rename the `.iron man` class with the one which you gave in the component. 

    Dependencies

    html2canvas chance jQuery jQueryUi

    Add the scripts in sequential manner as per the above list.

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

    Add the scripts present in scripts folder after doing npm install

    <script type="text/javascript" src="scripts/html2canvas.js"></script>
    <script type="text/javascript" src="scripts/chance.js"></script>

    Demo

    Click here

    Install

    npm i thanos-end-game

    DownloadsWeekly Downloads

    4

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    6.53 MB

    Total Files

    12

    Last publish

    Collaborators

    • knowankit