Javascript-форум (https://javascript.ru/forum/)
-   Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)
-   -   Как добавить прозрачность картинке при клике на li в IE??? (https://javascript.ru/forum/css-html-internet-explorer/35397-kak-dobavit-prozrachnost-kartinke-pri-klike-na-li-v-ie.html)

Андрей Лебедев 09.02.2013 23:30
Как добавить прозрачность картинке при клике на li в IE???
 
если добавить стиль прозрачности напрямую в <img> в IE, функция прозрачности работает нормально. А если добавляю класс через jQuery при click() не рабоает в IE а в остальных все ОК!
Помогите пожалуйста сделать так что бы IE понял что класс присваиваеться напярмую
<ul>
<li value="31"><img src="img1.jpg"></li>
<li value="30"><img src="img/2.jpg"></li>
<li value="33"><img src="img/3.jpg"></li>
</ul>
сделал так:
$('.currencies ul li').click(function() {
$('.currencies ul li img').addClass('opa');
});
//Стиль:
.opa {
opacity: 0.3;
filter: alpha(opacity=30);
-moz-opacity: 0.3;
}

рони 10.02.2013 00:08
Андрей Лебедев,
работает
<!DOCTYPE HTML>

<html>

<head>
  <title></title>
  <style type="text/css">
   .opa {
 opacity: 0.3;
 filter: alpha(opacity=30);
 -moz-opacity: 0.3;
 }
 img{
  width: 50px;
  height: 50px;
  }
  </style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>

<body>
<ul>
 <li value="31"><img src="http://i032.radikal.ru/0712/f1/9e278e7f8393.jpg"></li>
 <li value="30"><img src="http://img.galya.ru/galya.ru/Pictures2/ttp/2009/06/06/1294186.jpg"></li>
 <li value="33"><img src="http://wap.unsveta.com/images/2163cy320x480.jpg"></li>
 </ul>
<script type="text/javascript">
 $('ul li').click(function() {
 $('ul li img').addClass('opa');
 });
</script>

danik.js 10.02.2013 05:56
Андрей Лебедев, IE ведь разных версий бывает: IE6, IE7, IE8, IE9, IE10, во как! Проблема как я понял у вас только в IE8. Для него нужен такой синтаксис:
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"

Deff 10.02.2013 06:00
danik.js,
Можно записать jquery css opacity:0.3 прямо в tег - считать из родителя HTML и глянуть как пишется в конкретном браузере.
<!DOCTYPE HTML>

<html>

<head>
  <title></title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style id=Set>

</style>
</head>

<body>
<div style="display:none"><div id=tstCss></div></div>
<script type="text/javascript">
   var dcss = $('#tstCss');

function tstCss(a,c) {
   a.html('<p></p>');
   var b = a.find('p');
   c = c.split(':');
   eval('b.css({"'+c[0]+'":"'+c[1]+'"})');
   var str = a.html();alert('Вид тега:\n'+str)
   str=str.replace(/[\s\S]*?<[^>]*?style=([^>]*)>[\s\S]*$/igm,'$1');
   str = $.trim(str.replace(/["']/ig,''));
   return str;
}
var str = tstCss(dcss,'opacity:0.3');
alert(str)
$("#Set").append( 'ul li img.opa {'+str+'}' )

</script>
</body>
</html>



danik.js 10.02.2013 06:04
Deff, я ниче не понял :blink:


Часовой пояс GMT +3, время: 08:06.