problemas con opacity en ie8

[javicruzgv]

Buenas, he hecho un visor cambiando la propiedad de css opacity, y no me funciona en ie8 y supongo que en los anteriores. En los demás navegadores va bien.

trabajo modificando el siguiente codigo.

Os mando el codigo de el boton siguiente foto.

Código:

function siguiente(){
		if(foto!=cantidad){
			if(foto%6==0){
				newMini=foto/6;
				$("#cm"+mini).css('opacity', '0');
				$("#cm"+mini).css('z-index', '0');
				newMini++
				$("#cm"+newMini).css('opacity', '1');
				$("#cm"+newMini).css('z-index', '1');
				mini=newMini;
			}
			$("#"+foto).css('opacity', '0');
			$("#text"+foto).css('opacity', '0');
			foto++;
			$("#"+foto).css('opacity', '1');
			$("#text"+foto).css('opacity', '1');
		}else{
			$("#cm"+mini).css('opacity', '0');
			$("#cm"+mini).css('z-index', '0');
			mini=1;
			$("#cm"+mini).css('opacity', '1');
			$("#cm"+mini).css('z-index', '1');
			
			$("#"+foto).css('opacity', '0');
			$("#text"+foto).css('opacity', '0');
			foto=1;
			$("#"+foto).css('opacity', '1');
			$("#text"+foto).css('opacity', '1');	
		}	
	}

los he modificado con para que queden así, pero no funciona.

Código:

function siguiente(){
		if(foto!=cantidad){
			if(foto%6==0){
				newMini=foto/6;
				$("#cm"+mini).css('opacity', '0');
				$("#cm"+mini).css('z-index', '0');
				newMini++
				$("#cm"+newMini).css('opacity', '1');
				$("#cm"+newMini).css('z-index', '1');
				mini=newMini;
			}
			$("#"+foto).css('opacity', '0');
			$("#"+foto).css('filter', 'alpha(opacity=0)');
			$("#"+foto).css('-ms-filter', 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)');
			$("#text"+foto).css('opacity', '0');
			foto++;
			$("#"+foto).css('opacity', '1');
			$("#"+foto).css('filter', 'alpha(opacity=100)');
			$("#"+foto).css('-ms-filter', 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)');
			$("#text"+foto).css('opacity', '1');
		}else{
			$("#cm"+mini).css('opacity', '0');
			$("#cm"+mini).css('z-index', '0');
			mini=1;
			$("#cm"+mini).css('opacity', '1');
			$("#cm"+mini).css('z-index', '1');
			
			$("#"+foto).css('opacity', '0');
			$("#"+foto).css('filter', 'alpha(opacity=0)');
			$("#"+foto).css('-ms-filter', 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)');
			$("#text"+foto).css('opacity', '0');
			foto=1;
			$("#"+foto).css('opacity', '1');
			$("#"+foto).css('filter', 'alpha(opacity=100)');
			$("#"+foto).css('-ms-filter', 'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)');
			$("#text"+foto).css('opacity', '1');	
		}	
	}

Alguien sabe que más puedo hacer?

[Carlangueitor]

Pude ser un bug de hasLayout, prueba poniéndole en tu css zoom: 1; al elemento en cuestión (en tu hoja de estilos).

Saludos

[javicruzgv]

No funciona, la idea es si alguien sabe como hacer que aparezca y desaparezca un campo sin usar opacity y que funcione en todos los navegadores.

Gracias.

[Carlangueitor]

display: block|none;

O usar las funciones que ya tiene jQuery:

Código Javascript:

$("#elem").hide();
$("#elem").show();
 

Saludos

[javicruzgv]

Gracias, lo he arreglado con el display. El otro problema que tenia era la forma de declarar las funciones, que el ie8 no deja declararlas así. Hay que declararlas $('etiqueta').click(function(){}) y no en onclick="javascript:siguiente()" que es como yo lo tenia.