new javascript file with event listeners for image gallery

js/meissner-wohnen.js

@@ -0,0 +1,48 @@
+(function() {
+
+
+    var wohnung = document.getElementsByClassName("wohnung-img"),
+        kueche = document.getElementsByClassName("kueche-img"),
+        bad = document.getElementsByClassName("bad-img"),
+        index = 0;
+
+
+    var setActive = function (element) {
+        document.getElementById(element).classList.add("active");
+    };
+
+    var setDeactive = function (element) {
+        document.getElementById(element).classList.remove("active");
+    };
+
+
+    for (index=0; index <= wohnung.length-1; index++) {
+        if (wohnung[index].addEventListener) {
+            wohnung[index].addEventListener("mouseenter", function(){setActive("wohnung")}, false);
+            wohnung[index].addEventListener("mouseleave", function(){setDeactive("wohnung")}, false);
+        } else {
+            wohnung.attachEvent("onmouseenter", function(){setActive("wohnung")});
+            wohnung.attachEvent("onmouseleave", function(){setDeactive("wohnung")});
+        }
+    }
+    for (index=0; index <= kueche.length-1; index++) {
+        if (kueche[index].addEventListener) {
+            kueche[index].addEventListener("mouseenter", function(){setActive("kueche")}, false);
+            kueche[index].addEventListener("mouseleave", function(){setDeactive("kueche")}, false);
+        } else {
+            kueche.attachEvent("onmouseenter", function(){setActive("kueche")});
+            kueche.attachEvent("onmouseleave", function(){setDeactive("kueche")});
+        }
+    }
+    for (index=0; index <= bad.length-1; index++) {
+        if (bad[index].addEventListener) {
+            bad[index].addEventListener("mouseenter", function(){setActive("bad")}, false);
+            bad[index].addEventListener("mouseleave", function(){setDeactive("bad")}, false);
+        } else {
+            bad.attachEvent("onmouseenter", function(){setActive("bad")});
+            bad.attachEvent("onmouseleave", function(){setDeactive("bad")});
+        }
+    }
+
+
+}());