Answer the question
In order to leave comments, you need to log in
How to rewrite map js function to be usable in ie11?
Hello! Found that ES6 code map() and `` don't work in IE 11 How is this piece of code to be rewritten cross browser or what polyfill can I use for this?
jQuery.noConflict();
jQuery(document).ready(function($) {
const keys = ["hard", "soft"];
document.head.appendChild((style => {
style.textContent = keys.map(key => `
#main-slider-wrapper .slider-key button[data-key="${key}"] {
background-image:
url(img/${key}-key-slider.png)
}
#main-slider-wrapper[data-key="${key}"] .slider img[src*="${key}-key"] {
opacity: 1;
}
#main-slider-wrapper[data-key="${key}"] .slider-key button[data-key="${key}"] {
filter: drop-shadow(0 0 0.5em #009af7) drop-shadow(0 0 0.2em rgba(255,255,255,0.5));
-webkit-filter: drop-shadow(0 0 0.5em #009af7) drop-shadow(0 0 0.2em rgba(255,255,255,0.5));
}
`).join("\n\n");
return style;
})(document.createElement("style")));
document.addEventListener("click", ({
target
}) => {
if (!target.matches(
`${keys.map(k => `[data-key="${k}"]`).join(", ")}, .slick-arrow`
)) return;
const root = target.closest("#main-slider-wrapper");
const key = target.dataset.key;
const index = keys.indexOf(key);
root.dataset.key = key;
for (const arrow of root.querySelectorAll(".slick-arrow")) {
arrow.dataset.key = keys[
(keys.length + (
arrow.classList.contains("left") ? -1 : 1
) + index) % keys.length
];
}
});
for (const e of document.querySelectorAll(`[data-key="${keys[0]}"]`))
e.click();
});
Answer the question
In order to leave comments, you need to log in
You are using es6. => ` that's it. It's syntax - polyfill won't help.
Paste the code here: https://babeljs.io/repl/
babel will convert it to es5, for example.
Read about: es5, es6 (es2015), babel, transpilers, differences between transpiler and polyfill
According to MDN , then support with ie9+, but if it still doesn’t work, then there is a polyfill in the same article
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question