-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathmain.js
More file actions
94 lines (89 loc) · 5.19 KB
/
main.js
File metadata and controls
94 lines (89 loc) · 5.19 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
const cat0 =
"https://plus.unsplash.com/premium_photo-1677101221533-52b45823a2dc?q=80&w=1471&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat1 =
"https://images.unsplash.com/photo-1573865526739-10659fec78a5?q=80&w=1315&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat2 =
"https://images.unsplash.com/photo-1495360010541-f48722b34f7d?q=80&w=1336&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat3 =
"https://plus.unsplash.com/premium_photo-1675188410128-08479b027489?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat4 =
"https://images.unsplash.com/photo-1533738363-b7f9aef128ce?q=80&w=1335&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat5 =
"https://images.unsplash.com/photo-1618826411640-d6df44dd3f7a?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat6 =
"https://images.unsplash.com/photo-1526336024174-e58f5cdd8e13?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat7 =
"https://plus.unsplash.com/premium_photo-1682036382992-c39bdcbdbc5d?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat8 =
"https://images.unsplash.com/photo-1592194996308-7b43878e84a6?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat9 =
"https://images.unsplash.com/photo-1596854407944-bf87f6fdd49e?q=80&w=1480&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat10 =
"https://images.unsplash.com/photo-1561948955-570b270e7c36?q=80&w=1201&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat11 =
"https://images.unsplash.com/photo-1519052537078-e6302a4968d4?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat12 =
"https://images.unsplash.com/photo-1529778873920-4da4926a72c2?q=80&w=1336&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat13 =
"https://images.unsplash.com/photo-1543852786-1cf6624b9987?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat14 =
"https://plus.unsplash.com/premium_photo-1677545182067-26ac518ef64f?q=80&w=1256&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat15 =
"https://plus.unsplash.com/premium_photo-1677545183884-421157b2da02?w=1200&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1pbi1zYW1lLXNlcmllc3wxfHx8ZW58MHx8fHx8";
const cat16 =
"https://plus.unsplash.com/premium_photo-1677545182425-4fb12bdb9faf?w=1200&auto=format&fit=crop&q=60&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1pbi1zYW1lLXNlcmllc3wyfHx8ZW58MHx8fHx8";
const cat17 =
"https://images.unsplash.com/photo-1574158622682-e40e69881006?q=80&w=1480&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat18 =
"https://images.unsplash.com/photo-1494256997604-768d1f608cac?q=80&w=1229&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat19 =
"https://images.unsplash.com/photo-1478098711619-5ab0b478d6e6?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
const cat20 =
"https://plus.unsplash.com/premium_photo-1667030474693-6d0632f97029?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D";
function catReplacer() {
//declare a variable, 'catImages', and assign it to an array with paths to cat images
const catImages = [
cat0,
cat1,
cat3,
cat4,
cat5,
cat6,
cat7,
cat8,
cat9,
cat10,
cat11,
cat12,
cat13,
cat14,
cat15,
cat16,
cat17,
cat18,
cat19,
cat20,
];
//select all images on website and store in an array
const allImages = document.querySelectorAll("img");
//select all images contained in <source> tags on website
const moreAllImages = document.querySelectorAll("source");
//loop through array of site images and for each el, replace the 'src' property with
//the local path to cat image
allImages.forEach((img) => {
img.src = catImages[Math.floor(Math.random() * catImages.length)];
img.srcset = catImages[Math.floor(Math.random() * catImages.length)];
});
//same looping logic, only for <source> tags on the page
moreAllImages.forEach((img) => {
img.src = catImages[Math.floor(Math.random() * catImages.length)];
img.srcset = catImages[Math.floor(Math.random() * catImages.length)];
});
}
//Invoke catReplacer every 5 seconds
setInterval(() => catReplacer(), 5000);
//Possible way to run catReplacer at random intervals
// function myFunction() {
// alert('oo');
// setTimeout(myFunction, Math.random() * 5000)
// }