ready
论坛版主
论坛版主
  • UID24
  • 粉丝0
  • 关注0
  • 发帖数433
  • 社区居民
  • 忠实会员
  • 原创写手
阅读:5716回复:0

JQuery慢慢出现和隐藏

楼主#
更多 发布于:2019-04-28 15:45
<%@ 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>
  


   <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>
---------------------
游客


返回顶部