Saludos a todos, Quien es el Pro que me puede ayudar con este inconveniente, tengo un banner y en Chrome y en Mozilla funciona bien pero en IE no, quien me puede ayudar con este tema muchas gracias de antemano.
Subí el error a esta página: podertecnologico.co
html:
Código HTML:
<!doctype html>
<html lang="es" xml:lang="es" xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<link rel="shortcut icon" href="http://podertecnologico.co/favicon.ico">
<meta http-equiv="Content-type" content="text/html;charset=iso-8859-15" />
<meta name="robots" content="All" />
<meta name="Revisit-after" content="1 Day" />
<meta name="author" content="OK Colombia">
<meta name="viewport" content="width=device-width, user-scalable=yes, minimum-scale=0.4, maximum-scale=1.0">
<meta name="msvalidate.01" content="0A643BE88A41754F1B1220BA51E2556A" />
<meta name="geo.region" content="CO-ANT" />
<meta name="geo.placename" content="Medell&2015 OK Colombia" />
<meta name="geo.position" content="6.231869;-75.590381" />
<meta name="ICBM" content="6.231869, -75.590381" />
<link href="https://plus.google.com/115277859324629335863" rel="publisher" />
<meta name="Description" content="Regalos, Desayunos y almuerzos en Medellin">
<meta name="keywords" content="Desayuno, almuerzos, tamal, regalos, Medellin" />
<title>OK Colombia</title>
<script type="text/javascript" src="js/modernizr.custom.53451.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-45218910-1', 'podertecnologico.co');
ga('send', 'pageview');
</script>
<script>
(function() {
setInterval(function(){
var el = document.getElementById('blink');
if(el.className == 'luz'){
el.className = 'luz on';
}else{
el.className = 'luz';
}
},500);
})();
</script>
</head>
<body>
<div class="centroweb">
<header id="cabeza">
<div class="logo">
<img src="images/logocorazon.png" USEMAP="#logo1" alt="Logo okcolombia" border=0 width="115" height="90" >
</div>
<div class="titulogif"> <!-- Centrar quitar br-->
<br> <img src="images/conamor2.gif" alt="Titulo Poder Tecnológico" width="398" height="35" BORDER=0 />
</div>
<div class="siguenos grises"> <!-- Modificar redes crear OKcolombia 14-->
<a href="http://podertecnologico.co/mapaweb.html"> <img src="images/mapaweb.png" alt="Mapa Web" width="40" height="40" BORDER=0 title="Mapa Web"> </a>
<a href="https://www.facebook.com/profile.php?id=100009677883047" target="_blank"> <img src="http://podertecnologico.co/images/siguenosf.png" alt="Facebook" width="38" height="38" BORDER=0 title="Siguenos en Facebook" > </a>
<a href="https://plus.google.com/115277859324629335863/posts" rel="publisher" target="_blank"> <img src="http://podertecnologico.co/images/siguenosg.png" alt="Siguenos en Google mas" width="38" height="38" BORDER=0 title="Siguenos en Google +" ></a>
<a href="http://www.youtube.com/channel/UC70JHe8G-1iWMX2F0ezw9Wg" target="_blank"> <img src="http://podertecnologico.co/images/siguenosy.png" alt="Siguenos en Youtube" width="38" height="38" BORDER=0 title="Siguenos en Youtube" ></a>
<a href="http://www.linkedin.com/company/technological-power" target="_blank"> <img src="http://podertecnologico.co/images/siguenosi.png" alt="Siguenos en linkedin" width="40" height="40" BORDER=0 title="Siguenos en linkedin" ></a>
</div>
</header>
<nav>
<ul id="nav">
<li class="current"><a href="http://podertecnologico.co/index.html">Inicio</a></li>
<li><a href="http://podertecnologico.co/servicios/clases.html"><span class="luz" id="blink"><b>Servicios</b></span></a>
<ul>
<li><a href="http://podertecnologico.co/servicios/clases.html">Desayunos »</a>
<ul>
<li><a href="http://podertecnologico.co/servicios/clases/ofimatica.html">En Caliente </a></li>
<li><a href="http://podertecnologico.co/servicios/clases/internet.html">En Frío </a></li>
<li><a href="http://podertecnologico.co/servicios/clases/internet.html">Infantiles</a></li>
<li><a href="http://podertecnologico.co/servicios/paginasweb.html">Afecto</a></li>
<li><a href="http://podertecnologico.co/servicios/paginasweb.html">Ternura</a></li>
<li><a href="http://podertecnologico.co/servicios/paginasweb.html">Amistad</a></li>
<li><a href="http://podertecnologico.co/servicios/PruebasSofware.html">Detalles</a></li>
</ul>
</li>
<li><a href="http://podertecnologico.co/servicios/paginasweb.html">Presente</a></li>
<li><a href="http://podertecnologico.co/servicios/PruebasSofware.html">Regalos</a></li>
<li><a href="http://podertecnologico.co/servicios/PruebasSofware.html">Almuerzos</a></li>
</ul>
</li>
<li><a href="http://podertecnologico.co/quienessomos.html">Quiénes Somos</a></li>
<li><a href="http://podertecnologico.co/quienessomos.html">Como comprar</a></li>
<li><a href="http://podertecnologico.co/menucontacto.html">Contáctenos</a>
<ul>
<li><a href="http://podertecnologico.co/contactenos.html">Inquietudes </a></li>
<li><a href="http://podertecnologico.co/trabaja.html">Contactos</a></li>
</ul>
</li>
</ul>
</nav>
<body>
<br>
<section id="dg-container" class="dg-container">
<div class="dg-wrapper">
<a href="#"><img src="images/1.jpg" alt="image01"><div>Prueba1</div></a>
<a href="#"><img src="images/2.jpg" alt="image02"><div>Prueba2</div></a>
<a href="#"><img src="images/3.jpg" alt="image03"><div>Prueba3</div></a>
<a href="#"><img src="images/4.jpg" alt="image04"><div>Prueba4</div></a>
<a href="#"><img src="images/5.jpg" alt="image05"><div>Prueba5</div></a>
<a href="#"><img src="images/6.jpg" alt="image06"><div>Prueba6</div></a>
<a href="#"><img src="images/7.jpg" alt="image07"><div>Prueba7</div></a>
<a href="#"><img src="images/8.jpg" alt="image08"><div>Prueba8</div></a>
</div>
<nav>
<span class="dg-prev"><</span>
<span class="dg-next">></span>
</nav>
</section>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.gallery.js"></script>
<script type="text/javascript">
$(function() {
$('#dg-container').gallery({
autoplay : true
});
});
</script/>
</body>
</html>
Código CSS:
Ver original[B]
CSS:[/B]
.dg-container{
width: 100%;
height: 450px;
position: relative;
}
.dg-wrapper{
width: 481px;
height: 316px;
margin: 0 auto;
position: relative;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-perspective: 1000px;
-moz-perspective: 1000px;
-o-perspective: 1000px;
-ms-perspective: 1000px;
perspective: 1000px;
}
.dg-wrapper a{
width: 482px;
height: 316px;
display: block;
position: absolute;
left: 0;
top: 0;
background: transparent url(../images/browser.png) no-repeat top left;
box-shadow: 0px 10px 20px rgba(0,0,0,0.3);
}
.dg-wrapper a.dg-transition{
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.dg-wrapper a img{
display: block;
padding: 41px 0px 0px 1px;
}
.dg-wrapper a div{
font-style: italic;
text-align: center;
line-height: 50px;
text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
color: #333;
font-size: 16px;
width: 100%;
bottom: -55px;
display: none;
position: absolute;
}
.dg-wrapper a.dg-center div{
display: block;
}
.dg-container nav{
width: 58px;
position: absolute;
z-index: 1000;
bottom: 40px;
left: 50%;
margin-left: -29px;
}
.dg-container nav span{
text-indent: -9000px;
float: left;
cursor:pointer;
width: 24px;
height: 25px;
opacity: 0.8;
background: transparent url(../images/arrows.png) no-repeat top left;
}
.dg-container nav span:hover{
opacity: 1;
}
.dg-container nav span.dg-next{
background-position: top right;
margin-left: 10px;
}