0

这非常适合将 div 带入窗口,但是,当我尝试放置任何会反转动画的功能时(并使面板以与进入时相同的方式撤退,没有任何反应,哈哈……我是这个 jQuery 的新手东西。我确定我只是做错了什么。

我想要发生的事情是让窗口滑入(就像当前代码一样),然后在它出现 10 秒后,让窗口以与进入时相同的方式退回。

jQuery:

<!-- Live Support Slide-In -->
<script type="text/javascript">
$(document).ready(function() {

    // Store our panel into a variable.
    var $myPanel = $("#live-chat");

    // Get the height of the panel dynamically.
    var $myPanelHeight = parseInt($myPanel.height());

    // Immediately set the opacity to 0 - to hide it and set its bottom to minus its height.
    $myPanel.css({ "opacity" : 0, "bottom" : "-" + $myPanelHeight + "px" });

    // Set a timeout for the panel to slide and fade in.
    setTimeout(function() {

        $myPanel.animate({

            // The CSS properties we want to animate (opacity and bottom position).
            opacity: 1,
            bottom: '0'

        }, 2000, function() {

            // Animation complete. 
            // Here is where I tried putting an additional setTimeout(). Wouldn't help much, because I can't seem to reverse the animation.

                });

    }, 5000); // 30 seconds in MS

}); 
</script>
<!-- End Live Support Slide-In -->

HTML:

  <h1 class="tech" style="">Need Help?</h1>
  <p style="font-size:14px;">Don't worry! Our sales team is just one-click away. If you have questions regarding a product, your order status, etc. just click the link below and start a Live Chat session now.</p>
  <a style="display:block; text-align:right; font-weight:bold; font-size:14px;" href="#">+ Chat with a salesman</a>
  <div id="no-thanks-close"><img src="/images/components/no-thanks-close.png" alt="Close this Window..." /></div>

 </div>
</div>

任何帮助将不胜感激!:) 提前谢谢你们!

4

1 回答 1

0

从字面上做相反的事情。不透明度为 100%,然后可能捕获原始“顶部”位置的位置并将其保存为函数外部的变量,然后您调用与您现在使用顶部而不是底部的函数相反的函数捕获变量作为您的最高位置,理论上它应该可以工作,可能需要在此之外进行一些调整,但通常应该那么容易。

于 2012-07-31T01:57:26.613 回答