jquery--常用的函数2 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jquery--常用函数2</title>
<style>
.div1{width: 600px; height: 300px; background: red;}
.div2{width: 300px; height: 200px; background: yellow;}
</style>
<script src='../jquery-3.1.1.min.js'></script>
<script>
$(function(){
    $('.div1').hover(function(){
    // $(this).css('background','blue');
    // $('.div2').show(300);
    // $('.div2').fadeOut();
     $('.div2').slideUp();
    },
    function(){
    // $(this).css('background','yellow');
    // $('.div2').hide(300);
    // $('.div2').fadeIn();
       $('.div2').slideDown();
    });
});
</script>
</head>
<body>

<div class="div1">
         hover();鼠标移入移出  参数1移入  参数2 移出<br/>
         hover(function(){},function(){})<br/>
         show();显示         hide();隐藏<br/>
         $('.div2').show()   参数就是运动时间             <br/>
         fadeOut()  淡入        fadeIn 淡出
         $('.div2').fadeIn();参数就是变化时间 <br/>
         slideUp();向上变化          slideDown(); 向下变化<br/>
          $('.div2').slideDown();     参数就是变化时间<br/>
    </div>
<div class="div2">
</div>

</body>
</html>

 

posted @ 2016-12-09 22:03  distant-遥远  阅读(358)  评论(0)  编辑  收藏  举报