Get started with image-picker CDN
MIT licensed
Image picker: Software component for selecting/capturing device images for apps.
Tags:- Image
- Picker
- jquery
Stable version
Copied!
How to start using image-picker CDN
<!DOCTYPE html>
<html>
<head>
<title>Get started with image-picker CDN - cdnhub.io</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="https://cdn.cdnhub.io/image-picker/0.3.1/image-picker.min.js"></script>
</head>
<body>
<div class="container mt-5">
<button id="open-image-picker-button" class="btn btn-primary">Open Image Picker</button>
<input type="file" id="image-input" class="d-none" accept="image/*" @change="onImageChange">
<img id="output-image" class="img-thumbnail mt-3" src="" alt="Output image">
</div>
<script>
const imagePicker = new ImagePicker('#image-input', '#output-image');
document.getElementById('open-image-picker-button').addEventListener('click', () => {
imagePicker.open();
});
function onImageChange(event) {
imagePicker.setImage(event.target.files[0]);
}
</script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!