<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="jquery-2.1.4.min.js"></script> </head> <body> <div id="ddvd" style="display: none; 200px ; height: 200px;background-color: #425a66"></div> <input id="in" type="button" value="fadein"> <input id="out" type="button" value="fadeout"> <input id="toggle" type="button" value="fadetoggle"> <input id="fadeto" type="button" value="fadeto"> </body> <script> $("#in").click(function () { $("#ddvd").fadeIn(1000); }); $("#out").click(function () { $("#ddvd").fadeOut(1000); }); $("#toggle").click(function () { $("#ddvd").fadeToggle(1000); }); $("#fadeto").click(function () { $("#ddvd").fadeTo(1000,0.3); //后面的是透明度 }); </script> </html>