JQuery慢慢出现和隐藏

来源：互联网发布：日本电影追捕知乎编辑：程序博客网时间：2024/05/16 00:47

<%@ page language="java" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <style>
   .redborder {
    border:2px;
    dashed:#ff0000;
   }
  </style>
  <script src="js/jquery-1.4.1.js" charset="UTF-8"></script>
  <script type="text/javascript">
  /*
   $(document).ready(function(){
    ("#hit").click(function(){
     $("#show").fadeln("slow");
     $("#show").show("slow");
    })
    $("#close").click(function(){
     $("#show").fadeOut("slow");
     $("#show").hide("slow");
    })
   })
  */
  $(document).ready(function(){
   $("#hit").click(function(){
    //$("#show").show("slow");
    $("#show").fadeTo("slow",1);
   });

   $("#close").click(function(){
    //$("#show").hide("slow");
    $("#show").fadeOut("slow");
   });

   $("#ss1").click(function(){
    $("#test").slideDown(1000);
   });
   $("#ss2").click(function(){
    $("#test").slideUp(1000);
   });
  })
  </script>
</head>
<body>
<a href="javascript:;" id="hit">点击展开</a>
<a href="javascript:;" id="close">点击关闭</a>
<div id="show" style="height:200px; width:100px; display:none">
  jaigjain gioahjgiadjgioa
</div>
<br><br>
<input type="submit" id="ss1" value="clickMe-Down">
<input type="submit" id="ss2" value="clickMe-Up">
<div id="test" style="border:2px solid Red;background-color:#FFFFE0; width:400px" title="显示框">
  的是赶快阿卡阿看过那看过抗看按高考你
</div>
</body>
</html>