JQuery慢慢出现和隐藏

最新推荐文章于 2024-03-31 03:12:42 发布

e_yohn

最新推荐文章于 2024-03-31 03:12:42 发布

阅读量6.7k

点赞数

分类专栏： Web前端文章标签： jquery function javascript border input html

本文链接：https://blog.csdn.net/e_yohn/article/details/6708151

版权

Web前端专栏收录该内容

19 篇文章 0 订阅

订阅专栏

<%@ 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>

e_yohn

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery慢慢出现和隐藏

.redborder { border:2px; dashed:#ff0000; } /* $(document).ready(function(){ ("#hit").click(function(){
复制链接

扫一扫