当前位置: 移动技术网 > IT编程>网页制作>CSS > HTML 练习淡入淡出

HTML 练习淡入淡出

2019年03月20日  | 移动技术网IT编程  | 我要评论
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>title</title>
    <script src="jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="div" style="display:none; width:200px; height:200px; background-color:rebeccapurple"></div>
<input id="fadein" type="button" value="fadein">
<input id="fadeout" type="button" value="fadeout">
<input id="fadetoggle" type="button" value="fadetoggle">
<input id="fadeto" type="button" value="fadeto">
</body>
<script>
    $("#fadein").click(function(){
        $("div").fadein(1000);
    })
    $("#fadeout").click(function(){
        $("div").fadeout(1000);
    })
    $("#fadetoggle").click(function(){
        $("div").fadetoggle(1000);
    })
    $("#fadeto").click(function(){
        $("div").fadeto(1000, 0.5);
    })

</script>
</html>

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网