GitHub - williamtroup/Rink.js: 🔗 A JavaScript library for generating responsive HTML link targets.

🔗 A JavaScript library for generating responsive HTML link targets.

v1.3.2

What features does Rink.js have?

😏 Zero-dependencies and extremely lightweight!
🦾 Written in TypeScript, allowing greater support for React, Angular, and other libraries!
💻 Full API available via public functions.
⭐ Default sizes consistent with Bootstrap: sm, md, lg, xl, xxl.
🌈 Set your own custom size attributes!
🎥 Toggling responsiveness on/off support.
📃 Auto fetch support (when HTML is added via 3rd party libraries).

What browsers are supported?

All modern browsers (such as Google Chrome, FireFox, and Opera) are fully supported.

How do I install Rink.js?

You can install the library with npm into your local modules directory using the following command:

Or, you can also use the following CDN links:

https://cdn.jsdelivr.net/gh/williamtroup/Rink.js@1.3.2/dist/rink.min.js

How do I get started?

To get started using Rink.js, do the following steps:

1. Prerequisites:

Make sure you include the "DOCTYPE html" tag at the top of your HTML, as follows:

2. Include Files:

<script src="dist/rink.js"></script>

3. Setup Anchor Tags:

<a href="https://www.william-troup.com/" data-rink-js-sm="_blank" target="_self">Test Link SM</a>
<a href="https://www.william-troup.com/" data-rink-js-md="_blank" target="_self">Test Link MD</a>
<a href="https://www.william-troup.com/" data-rink-js-lg="_blank" target="_self">Test Link LG</a>
<a href="https://www.william-troup.com/" data-rink-js-xl="_blank" target="_self">Test Link XL</a>
<a href="https://www.william-troup.com/" data-rink-js-xxl="_blank" target="_self">Test Link XXL</a>
<a href="https://www.william-troup.com/" data-rink-js-800="_blank" data-rink-js-lg="_parent">Test Link (800, MD)</a>

4. Finishing Up:

That's it! Nice and simple. Please refer to the code if you need more help (fully documented).

How do I go about customizing Rink.js?

To customize, and get more out of Rink.js, please read through the following documentation.

5. Configuration:

Configuration options allow you to customize how Rink.js will function. You can set them as follows:

<script> 
    $rink.setConfiguration( {
        defaultTarget: "self"
    } );
</script>

推荐订阅源

Echo JS