Hey I'm trying to make a function that creates an alert if the name of an array of images matches the data attribute of the selected element. This is simply a test before I move forward with my actual plans but I'm stuck here. My confusion is twofold.
Note: Sorry, I am new to javascript, please bear with me.
1)How do I compare the name of an array with a var?
2)How do I search through all of the arrays present, do I need to make nested arrays, or another function for that? idk
My webpage have an undetermined amount of modal images which , when clicked, open a slideshow album of images. I got this working for 1 image then realized that to have it work for an undetermined amount of slideshows of undetermined size I should make a function that fills the slideshow div. I planned to have each modal image to have a data attribute of "1,2,3...etc" and have a bunch of arrays with the images each named similarly "1,2,3...etc" and if the names of both match up, then it will populate the slideshow with the images in the array. This way If i need to add another modal image all i need to do is give it the appropriate id and add an array of its images. I hope this was clear, if not then I will provide more clarification.
HTML:
<div class="row">
<div class="column">
<img id="modal-1" src="https://www.yosemitehikes.com/images/wallpaper/yosemitehikes.com-bridalveil-winter-1200x800.jpg" style="max-width:100%" data-modal="1" onclick="/*openModal();currentSlide(1);*/ fillSlides(this);" class="hover-shadow cursor">
</div>
</div>
Javascript:
function fillSlides(modalID){
var slides_1 = ["Images/LS_01.jpg", "Images/LS_02.jpg", "Images/LS_03.jpg", "Images/LS_04.jpg" ];
var slides_2 = ["Images/LS_05.jpg", "Images/LS_06.jpg", "Images/LS_07.jpg", "Images/LS_08.jpg" ];
var slides_3 = ["Images/LS_09.jpg", "Images/LS_10.jpg", "Images/LS_11.jpg", "Images/LS_12.jpg" ];
var modal_num = modalID.getAttribute('data-modal');
alert(modal_num);
}