jQuery简单实现隐藏以及显示特效

 这篇文章主要介绍了jQuery简单实现隐藏以及显示特效,需要的朋友可以参考下

 
 

简单的 隐藏以及显示的代码如下:

 

代码如下:

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p id="p1">如果点击“隐藏”按钮,我就会消失。</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
</body>
</html>

 

效果很不错,代码也很简单,希望大家能够喜欢。

时间: 2024-12-27 09:54:32

jQuery简单实现隐藏以及显示特效的相关文章

jQuery简单实现隐藏以及显示特效_jquery

简单的 隐藏以及显示的代码如下: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <script src="/jquery/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){   $("#hide").click(function

Javascript与jQuery方法的隐藏与显示_jquery

示例代码很简单,直接奉上,就不多废话了 复制代码 代码如下: <html> <head> <title>denotoggle</title> <style> #box {     width: 100px;     height: 100PX;     background-color: #ddd } .show {     visibility: hidden; } </style> <script src="jqu

jQuery元素的隐藏与显示实例

 这篇文章主要介绍了jQuery元素的隐藏与显示的方法,实例分析了hide与show的使用技巧,需要的朋友可以参考下     本文实例讲述了jQuery元素的隐藏与显示的方法.分享给大家供大家参考.具体实现方法如下:   代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script t

jQuery元素的隐藏与显示实例_jquery

本文实例讲述了jQuery元素的隐藏与显示的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml">  <head runat="server">      <title></title>      <script type="text/jscript" src="jquery/jqu

JQuery DIV 动态隐藏和显示的方法_jquery

1. 如果在载入是隐藏: <head> <script language="javascript"> function HideWeekMonth() { $("#tt1").hide(); $("#tt2").hide(); } </script> </head> <body onLoad="HideWeekMonth()"> </body> 2. 动态

JS实现“隐藏与显示”功能(多种方法)_javascript技巧

下面我将效果图展示出来: 1,通过按钮实现隐藏与显示: 这个是通过按钮点击实现的隐藏与显示,具体代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>通过按钮实现隐藏和显示</title> <style type="text/css"> .body{ margin: 0 auto; } #show{ wid

span点击隐藏和显示ul;span点击隐藏和显示ul

问题描述 span点击隐藏和显示ul:span点击隐藏和显示ul C#中关于Div+span+ul+li布局的时候,未知个数的span和ul,如何使得点击span(1)关闭其他的ul:(2)本身的ul点击第一次开启,点击第二次就关闭.![点击span,自己所在的ul是执行隐藏和显示的操作:在同时关不其他的所有的ul![![图片说明图片说明555555 解决方案 你的结构呢?下面是jquery的写法 $('span').click(function(){ var dv=$(this).closes

jquery简单的div显示和隐藏特效

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

jQuery简单实现列表隐藏和显示效果示例_jquery

本文实例讲述了jQuery简单实现列表隐藏和显示效果.分享给大家供大家参考,具体如下: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>隐藏和显示</title> <style> *{ padding: 0; margin: 0;} li{ list-style-type: none;} bo