0

你能告诉我为什么这个 js 可以在 Firefox 和 Chrome 中运行,但不能在 Internet Explorer 中运行吗?我现在正在尝试解决 3 天,但我不知道为什么它不起作用。我希望这至少可以在 IE 8,9 和 10 上运行。如果有人现在知道如何解决这个问题,我会非常高兴。

脚本

$(document).ready(function() {

$('<img class="envtop" src="images/envtop.jpg" alt=" "/>').prependTo('#testimo li');
$('<img class="envbot" src="images/envbot.png" alt=" "/>').appendTo('#testimo li');
$('<img class="envshadow" src="images/shadow.png" alt=" "/>').appendTo('#testimo li');

$('.envelope').mouseover(function() {
   $(this).find('.envtop').addClass('envani') 
     .end().find('.envbot').addClass('envani') 
     .end().find('.list').addClass('listani');
});

$(".envelope").mouseout(function() {
     $(this).find('.envtop').removeClass('envani')
    .end().find('.envbot').removeClass('envani')
    .end().find('.list').removeClass('listani');
});

$('.envelope').click(function() {
    $(this).find('.list')
    .toggleClass("listmove");
});

});

HTML

 <!DOCTYPE html>
 <html>
<head>
<link href="style2.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/modernizr.custom.33897.js"></script>
<script type="text/javascript" src="js/js1.js"></script>
</head>
<body>
<ul id="testimo">
<li class="envelope">
<div class="list">
 <blockquote>XXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXX XXXXXXXX XXXXXX</blockquote>
 </div>
</li>
</ul>
</body>
</html>

CSS

      .envelope {
      width:300px;
      height:150px;
      position:relative;
      padding: 120px 24px 0;
      overflow: hidden;
      float: left;
      -webkit-transition:1s;
      transition:1s;
      cursor: pointer;
      }
      .list {
      width:236px;
      height:180px;
      background:white;
      padding: 30px 20px 0;
      font-size: 16px;
      -webkit-transition:1s;
      position:absolute;
      top:120px;
      left:36px;
      z-index:2;
      -webkit-transition:0.8s;
      transition:0.8s;
      font-size: 16px;
      background:gray;
      }
      .envtop {
      position:absolute;
      top:20px;
      left: 24px;
      z-index:1;
      -webkit-transition:0.5s;
      transition:0.5s;
      }
      .envbot {
      position:absolute;
      top:20px;
      left: 24px;
      z-index:3;
      -webkit-transition:0.5s;
      transition:0.5s;
      }
      .envani {
      -ms-transform:rotate(6deg);
      -webkit-transform:rotate(6deg);
      transform:rotate(6deg);
      left: 35px;
      top: 10px;
      }
      .listani {
      top:80px;
      left: 45px;
      }
      .envshadow {
      position: absolute;
      bottom:0;
      z-index: 4;
      left: 0;
      }
      .listmove {
      top:0px;
      }
4

1 回答 1

1

你能在 IE10 中查看下面给出的 jsfiddle 链接吗

关联

注意:您在哪里编写 js 代码?是外部js吗?如果它是内部(页面本身)js,您需要在<script type="text/javascript" language="javascript"> ... </javascript>标签内编写 javascript。

于 2013-05-31T12:47:47.943 回答