Добрый день! Есть код, с помощью которого при клике на кнопку меняется цвет продукта на картинках. В браузерах IE (у меня 11) и FireFox вместо картинок пустое место. Подскажите, пожалуйста, как можно решить эту проблему.
$('input[type="radio"]').click(function() {
$(".sovmestimost").css({
"content": "url(http://di-tech.kiev.ua/wp-content/uploads/sovmestimost-" + $(this).val() + ")"
});
$(".dvametra").css({
"content": "url(http://di-tech.kiev.ua/wp-content/uploads/dvametra-" + $(this).val() + ")"
});
$(".fast-carging").css({
"content": "url(http://di-tech.kiev.ua/wp-content/uploads/fast-carging-" + $(this).val() + ")"
});
$(".speed").css({
"content": "url(http://di-tech.kiev.ua/wp-content/uploads/speed-" + $(this).val() + ")"
});
$(".sgibania").css({
"content": "url(http://di-tech.kiev.ua/wp-content/uploads/sgibania-" + $(this).val() + ")"
});
});
.sovmestimost {
width: 100%;
content: url(http://di-tech.kiev.ua/wp-content/uploads/sovmestimost-black.jpg);
}
.dvametra {
width: 100%;
content: url(http://di-tech.kiev.ua/wp-content/uploads/dvametra-black.jpg);
}
.fast-carging {
width: 100%;
content: url(http://di-tech.kiev.ua/wp-content/uploads/fast-carging-black.jpg);
}
.speed {
width: 100%;
content: url(http://di-tech.kiev.ua/wp-content/uploads/speed-black.jpg);
}
.sgibania {
width: 100%;
content: url(http://di-tech.kiev.ua/wp-content/uploads/sgibania-black.jpg);
}
.color-usb {
width: 120px;
height: 120px;
background: rgba(98, 192, 221, 0.4);
border: 1px solid rgba(255, 154, 55, 1);
border-radius: 100px;
}
.color-usb:hover {
cursor: pointer;
background: rgba(98, 192, 221, 0.5);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="text-align: center; position: relative;z-index: 99999;">
<input type="radio" style="display: none;" value="black.jpg" name="radioButton" id="blackButton" />
<label for="blackButton"><img class="color-usb" src="http://di-tech.kiev.ua/wp-content/uploads/color-black.png"></label>
<input type="radio" style="display: none;" value="gray.jpg" name="radioButton" id="grayButton" />
<label for="grayButton"><img class="color-usb" src="http://di-tech.kiev.ua/wp-content/uploads/color-gray.png"></label>
</div>
<div class="sovmestimost"></div>
<div class="dvametra"></div>
<div class="fast-carging"></div>
<div class="speed"></div>
<div class="sgibania"></div>
firebug
? И посмотрели что там не так? Посмотрели консоль? вFF
.