Question

我在我的网站上使用此代码：

var panel = $('.couch-hide');
    var originalPos = panel.css("right");
    panel.toggle(function() {$(this).animate({right:0},1000, 'easeOutBounce');},function(){$(this).animate({right:originalPos},1000);}

);

在FF中它可以完美地工作，但在IE中，它不会在点击时弹出。此外，因为我使用CSS右侧显示水平滚动条，但在FF中它不显示。关于如何解决这个问题的任何想法？

Answer 1

嗯，在Opera，Firefox和IE6 / 8中对我来说也一样。

使用以下代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>sandbox</title>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript" src="jquery.easing.js"></script>
  <script type="text/javascript">
    $(function(){
      var panel = $('.couch-hide');
      var originalPos = panel.css("right");
      panel.toggle(
        function(){$(this).animate({right:0}, 1000, 'easeOutBounce');},
        function(){$(this).animate({right:originalPos}, 1000);}
      );
    });
  </script>
  <style type="text/css">
    .couch-hide {
      position: absolute;
      right: 100px;
    }
  </style>
</head>
<body>
  <div class="couch-hide">Click me!</div>
</body>
</html>

文字反弹到屏幕的右边缘，然后飞回来。

虽然使用toggle来做这件事似乎很奇怪。至少文档没有提到当你为它提供两个函数时会发生什么。或者这是jquery.easing.js添加的行为？不熟悉那个。

如果您提供HTML和CSS也会有所帮助。

切换不在IE中工作

1 个答案: