Question

我对这些css参数有所反对：

 position:fixed;
 top:0px;
 left:25%;
 width:50%;
 height: 300px;
 -moz-border-radius-topleft: 0px;
 -moz-border-radius-topright: 0px;
 -moz-border-radius-bottomright: 10px;
 -moz-border-radius-bottomleft: 10px;
 -webkit-border-radius: 0px 0px 10px 10px;
 border-radius: 0px 0px 10px 10px;
 display:none;
 background: -moz-linear-gradient(
        top,
        #807980 0%,
        #3d323d);
 background: -webkit-gradient(
        linear, left top, left bottom, 
        from(#807980),
        to(#3d323d));
 -webkit-box-shadow: 0px 0px 10px rgba(46, 50, 50, 1);
 -moz-box-shadow:    0px 0px 10px rgba(46, 50, 50, 1);
 -o-box-shadow:    0px 0px 10px rgba(46, 50, 50, 1);
 box-shadow:         0px 0px 10px rgba(46, 50, 50, 1);
 opacity: 0.2;

我有这个javascript，我正用它向下滑动并向上滑动这个div：

 <script type="text/javascript">
 $(document).ready(function(){
 $('#main_div').click(function(){
 $('#slide_down').slideToggle(2000);
 });
 });
 </script>

在我用css3，hover和transition进行滑动之前，我正在改变css中对象的不透明度，但是现在当我使用javascript来滑动它时。在滑下时是否有机会将对象不透明度从0.2更改为0.8？所以它创造了非常好的效果？谢谢。

Answer 1

你可以同时使用.animate（）来达到这个效果：

$('#slide_down').slideToggle(2000);
$('#slide_down').animate({ opacity: 0.8 }, 2000);

我在这里测试它，但它似乎执行第一个然后另一个：http://jsfiddle.net/yHCvL/

在slideDown函数期间更改不透明度

1 个答案: