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