mirror of
https://github.com/janishutz/color-thief.git
synced 2025-11-25 13:54:25 +00:00
- `/dist/color-thief.umd.js`: UMD module. For simple script tag loading that exposes a global variable or for RequireJS AMD support. - `/dist/color-thief.js`: CommonJS module. Entry point for Node.js and Browserify. - `/dist/color-thief.mjs`: ES6 module. For modern browsers as well as Webpack and Rollup. - `/dist/color-thief.min.js`: Duplicate of `/dist/color-thief.umd.js`. Kept around to maintain backwards compatibility.
40 lines
892 B
HTML
40 lines
892 B
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
|
<title>Color Thief</title>
|
|
<link rel="stylesheet" href="./screen.css">
|
|
</head>
|
|
<body>
|
|
|
|
<img src="./img/rainbow-horizontal.png" />
|
|
|
|
<div id="result"></div>
|
|
|
|
<script type="module">
|
|
import ColorThief from '../../dist/color-thief.mjs';
|
|
|
|
const colorThief = new ColorThief();
|
|
|
|
|
|
const img = document.querySelector('img');
|
|
|
|
function getColorFromImage(img) {
|
|
const result = colorThief.getColor(img);
|
|
document.querySelector('#result').innerText = result;
|
|
}
|
|
|
|
if (img.complete) {
|
|
getColorFromImage(img);
|
|
} else {
|
|
image.addEventListener('load', function() {
|
|
getColorFromImage(img);
|
|
});
|
|
}
|
|
</script>
|
|
|
|
|
|
</body>
|
|
</html>
|