点击 显示隐藏

<body>
<div class="box">
<input type="checkbox" />
<div class="toggle"></div>
</div>
</body>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function(){
$("input").click(function(){
$(".toggle").toggle("500");
})
})
</script>

时间: 2024-07-30 00:40:30

点击 显示隐藏的相关文章

HTML5--》点击显示隐藏内容

<details>浏览器支持比较差,可以用JavaScript实现这种功能. 1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>js点击显示隐藏内容</title> 6 <style type="text/css" > 7 body{font-size:12px;} 8 span{f

jquery 点击显示隐藏的三种方法

jquery点击显示隐藏的三种方法,从复杂到简单.使用jquery需要引用jquery库,如右所示<script src="jquery-1.11.3.min.js"type="text/javascript"></script>. 旁边按钮随着收缩展开发生状态变化,展开+变—,收缩—变+. 收缩效果: 展开效果: 一.HTML结构(盗用网上的) <body> <!-- 收缩展开效果 --><li class=&

js 事件点击 显示 隐藏

1 <div style="position:absolute;left:40%;top:10%;border-style:dotted"> 2 <img src="zgl.jpg"/><br/> 3 <center> 4 <input type="button" value="隐藏"/> 5      6 <input type="button&qu

锋利的Jquery(点击显示隐藏div)

点击显示隐藏div 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text

css样式一开始不显示,点击显示隐藏

先隐藏在字段里写style="display:none" 点击显示隐藏 $(".a").click(function(){ if($("#aa").css("display")=="none"){ $("#aa").show(); }else{ $("#aa").hide(); } }); 替换属性 先设置好class名字 $("#btn2").a

jquery点击显示隐藏块

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>点击显示块</title> <script src="script/jquery-2.1.4.js"></script>            //引入jquery模块 <style>          

js点击显示隐藏密码

<!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-

多个点击显示隐藏例子代码

JS如下: function showoptions(id){ switch(id) { case 0: box=$(".neirong0"); icon=$("#icon0"); break; case 1: box=$(".neirong1"); icon=$("#icon1"); break; case 2: box=$(".neirong2"); icon=$("#icon2")

纯CSS让radio实现点击显示隐藏效果

—————————————————————————————————————————————————————————————————— ———————————————————————————————————————————————————————————————————— ———————————————————————————————————————————————————————————————————— html <style> #faq input[type='radio']{ displ