onedionys-responsive-image-components

Welcome to One Dionys - Responsive Image Components! 👋

Components that automatically adjust the image size and quality according to the user's device and screen width. 💖

💾 Requirements

• Web Browser - Can be used as an emulator to build applications. Example [Chrome, Firefox, Safari & Opera].
• Internet - Because many use CDN and to make it easier to find solutions to all problems.

🎯 How To Use

Example Syntax

const createResponsiveImage = require('./src/responsiveImage');

// Create a responsive image
const imageUrl = 'https://example.com/image.jpg';
const altText = 'Example Image';
const width = 800;
const height = 600;
const imageElement = createResponsiveImage(imageUrl, altText, width, height);

// Append the image element to a container in the DOM
document.getElementById('image-container').appendChild(imageElement);

Explanation

• The createResponsiveImage function accepts parameters for the image URL, alternative text, width, height, and optional CSS class name. It returns a div element containing an img element with the provided attributes.

Return Value

• The function returns an HTMLElement representing the image container with responsive attributes.

📆 Release Date

• v1.0.0 : 17 March 2024
• v1.0.1 : 18 March 2024
• v1.0.2 : 30 March 2024
• v5.0.0 : 31 March 2024

🧑 Author

• Facebook : Oned Ionys
• Instagram : @onedionys
• Twitter : @onedionys
• LinkedIn : @onedionys

📝 License

• Copyright © 2024 One Dionys
• One Dionys - Responsive Image Components is an open source project licensed under the MIT license

☕️ Suppport & Donation

Love One Dionys - Responsive Image Components? Support this project by donating or sharing with others in need.

Made with ❤️ One Dionys