Добрый день.
Подскажите, пожалуйста, почему данный скрипт работет Хроме, Яндексе, Комодо, Опере и не работает в IE8-11 и Файерфоксе.
И как можно его изменить кроссбраузерно.
Этот скрипт меняет фоновые картинки у менюшки в зависимости от того, развернута эта менюшка или нет (за разворачиваемость по клику отвечает другой скрипт).
Заранее спасибо!
<html>
<meta charset="utf-8">
<title></title>
<meta name="title" content="">
<style type="text/css">
.qrf_list li .qrf_name{position:relative;display:block;background:red url(http://site.ru/images/bottom_white_10px.png) no-repeat 98% 50%}
</style>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(function(){
$(".qrf_name").on('click', function(){
if ("url(http://site.ru/images/bottom_white_10px.png)" === $(this).css("background-image")) {
$(this).css({"background-image":"url(http://site.ru/images/top_white_10px.png)","background-color":"blue"});
alert("11111111");
}
else {
$(this).css({"background-image":"url(http://site.ru/images/bottom_white_10px.png)","background-color":"red"});
alert("222222222");
}
return false;
});
});
</script>
<ul class="qrf_list">
<li><span class="qrf_name">НАЗВАНИЕ БЛОКА</span>
<ul>
<li>
СОДЕРЖИМОЕ БЛОКА1
</li>
<li>
СОДЕРЖИМОЕ БЛОКА2
</li>
</ul>
</li>
</ul>
</html>