jQuery随便控制任意div隐藏的方法
<!DOCTYPE html>
<html>
<head>
<style>
div { background:#ece023; width:30px;
height:40px; margin:2px; float:left; }
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<div>a</div>
<div>b</div>
<div>c</div>
<div>d</div>
<div>e</div>
<div>f</div>
<script>
$("div").click(function () {
$(this).hide(1000);
});
</script>
</body>
</html>
相关推荐
-
jQuery拖动div、移动div、弹出层实现原理及示例
代码演示: http://www.imqing.com/demo/movediv.html 大概原理: 使div的position为绝对定位absolute,然后控制其top与left值,需要监听鼠标事件,主要用到mousedown, mousemove, mouseup. 在mousedown后,记录mousedown时鼠标与需要移动的div的位置,然后取得两者之差,得到在鼠标移动后,div的位置.即: left = 当前鼠标位置.x - (鼠标点击时的.x值 - div的初始位置x值) to
-
jquery实现弹出div,始终显示在屏幕正中间的简单实例
以下代码块就能始终让弹出div位于屏幕的正中心,希望对大家有所帮助! 复制代码 代码如下: //让指定的DIV始终显示在屏幕正中间 function setDivCenter(divName){ var top = ($(window).height() - $(divName).height())/2; var left = ($(window).width() - $(divName).width())/2; var s
-
jQuery实现的Div窗口震动特效
复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-T
-
jQuery设置div一直在页面顶部显示的方法
jQuery部分 复制代码 代码如下: <script src="JS/jquery-1.8.3.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { var elm = $('#pordAttr'); var startPos = $(elm).offset().top; $.event.add
-
jquery下div 的resize事件示例代码
这是某位大神写的jquery下div 的resize事件. 复制代码 代码如下: //resize of div (function($, h, c) { var a = $([]), e = $.resize = $.extend($.resize, {}), i, k = "setTimeout", j = "resize", d = j + "-special-event", b = "delay", f = "
-
利用div+jquery自定义滚动条样式的2种方法
最近做项目中有一个模块是用于实时监控的,左边有个菜单栏用于显示所有的设备,那当然是从数据库中动态获取的了,右边是个iframe用于显示监控画面.本来这个功能并不复杂,左边的菜单项是利用dtree.js来实现的,可时当功能实现完成之后,却发现一个问题,就是左边菜单栏中的设备名有的会很长,会超出了div的长度,准确说是左边iframe的宽度和长度不够.那么,这时就必须要利用滚动条了,可以设置左边菜单项div的overflow-x:auto;overlfow-y:auto;这样就会自动生成了滚动条,但
-
Jquery实现Div上下移动示例
复制代码 代码如下: $(this).ready(function() { $(".up").each(function() { $(this).click(function() { var $tr = $(this).parents("li"); if ($tr.index() != 0) { $tr.prev().before($tr); } }); }); var trLength = $(".down").length; $("
-
jquery和js实现对div的隐藏和显示方法
jQuery对div的显示和隐藏: 显示: 复制代码 代码如下: $("#id").show() 隐藏: 复制代码 代码如下: $("#id").show() js对div的显示和隐藏: div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白 复制代码 代码如下: style="visibility: none;" document.getElementById("typediv1").style.vi
-
JQuery控制div外点击隐藏而div内点击不会隐藏的方法
本文实例讲述了JQuery控制div外点击隐藏而div内点击不会隐藏的方法.分享给大家供大家参考.具体如下: 比如有个div其id为body,实现在div外点击隐藏,div内点击不隐藏,采用jQuery实现如下: 复制代码 代码如下: $("#body").click(function(e) { $(this).show(); e.stopPropagation(); }); $(document).click(function(event) {
-
jQuery随便控制任意div隐藏的方法
复制代码 代码如下: <!DOCTYPE html><html><head> <style> div { background:#ece023; width:30px; height:40px; margin:2px; float:left; } </style> <script src="http://code.jquery.com/jquery-latest.min.js"></sc
-
jQuery焦点控制图层展示延迟隐藏的方法
本文实例讲述了jQuery焦点控制图层展示延迟隐藏的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> </head> <body> <b id="button"
-
React控制元素显示隐藏的三种方法小结
目录 React控制元素显示隐藏的方法 方法一 方法二 方法三 React切换显示和隐藏 总结 React控制元素显示隐藏的方法 React控制元素显示和隐藏的方法目前我知道的有三种方法: 第一种是通过state变量来控制是否渲染元素,类似vue中的v-if. 第二种是通过style控制display属性,类似vue 中的v-show. 第三种是通过动态切换className. 方法一 第一种方法是通过此例中showElem变量来控制是否加载元素的,如果showElem为false,内容是直接不
-
jquery控制页面的展开和隐藏实现方法(推荐)
[jquery代码] <script> require(["jquery","validate","bootstrap","lhgcalendar"],function($) { $(function(){ $("form").validate(); }); $(".up").click(function(){ $(this).parent().parent().paren
-
jQuery实现获取隐藏div高度的方法示例
本文实例讲述了jQuery实现获取隐藏div高度的方法.分享给大家供大家参考,具体如下: <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>测试获取隐藏div高度</title> <meta name="description" content="jquery获取隐
-
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
本文实例讲述了jQuery通过控制节点实现仅在前台通过get方法完成参数传递.分享给大家供大家参考.具体分析如下: 这样也是HTML DOM那部分的内容,javascript与jquery等前端脚本语言的核心就是要控制每一个节点,对每一个节点进行增删改查,这样才能够真正地活用javascript与jquery等前端脚本写出一个又一个华丽丽的东西. javascript控制节点,笔者已经在之前的[JavaScript针对网页节点的增删改查用法实例]有过相关介绍,现在是通过jquery这一javas
-
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
这是一个示例: <html> <head> <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $(".btn1").cl
-
javascript控制层显示或隐藏的方法
本文实例讲述了javascript控制层显示或隐藏的方法.分享给大家供大家参考.具体实现方法如下: <html> <head> <title>中国风</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <script language="JavaScript&qu
-
jQuery实现控制文字内容溢出用省略号(…)表示的方法
本文实例讲述了jQuery实现控制文字内容溢出用省略号(-)表示的方法.分享给大家供大家参考,具体如下: jQuery限制字符字数的方法 $(function(){ //限制字符个数 $(".text").each(function(){ var maxwidth=23; if($(this).text().length>maxwidth){ $(this).text($(this).text().substring(0,maxwidth)); $(this).html($(th
随机推荐
- 用htc实现进度条控件
- Android时间对话框使用方法详解
- Mongodb中MapReduce实现数据聚合方法详解
- js确定对象类型方法
- 每天一篇javascript学习小结(Array数组)
- Base64编码加密JS代码网页版
- tomcat7的配置文件server.xml解析
- 按扩展名分类批处理bat文件
- javascript prototype原型详解(比较基础)
- 使用vue.js实现联动效果的示例代码
- js弹出层(jQuery插件形式附带reLoad功能)
- 使用lua实现php的print_r()函数功能
- Nodejs如何复制文件
- Oracle SecureFile的功能第1/4页
- 打开windowXP的21端口即用winxp架设ftp服务器
- jQuery实现两款有动画功能的导航菜单代码
- 浅谈js的异步执行
- 用KWF打造与众不同的VPN服务器
- 只防病毒不安全 网络安全还要防哪些?
- php变量作用域的深入解析