JQury slideToggle闪烁问题及解决办法


Posted in Javascript onJuly 05, 2011

一、解决方法
在页面配置<!DOCTYPE />如下
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
其中 "http://www.w3.org/TR/html4/loose.dtd" 是必需的,如果少了这句话仍然会有闪烁的问题,具体为什么我不太清楚
我查了下,这个句话好象牵扯到规范。如果有大牛看到这篇帖并知道原因,请留言,谢谢
二、例子
[下面是一个例子]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<script type="text/javascript" src="js/jquery-1.6.2.min.js"> 
</script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$(".flip1").click(function(){ 
$(".panel").slideToggle("slow"); 
}); 
}); 
$(document).ready(function(){ 
$(".flip2").click(function(){ 
$(".pane2").slideToggle("slow"); 
}); 
}); 
</script> 
<style type="text/css"> 
div.panel,p.flip1,div.pane2,p.flip2 
{ 
margin:0px; 
padding:5px; 
text-align:center; 
background:#e5eecc; 
border:solid 1px #c3c3c3; 
width:150px; 
} 
div.panel,div.pane2 
{ 
display:none; 
} 
</style> 
</head> 
<body> 
<p class="flip1">基础数据</p> 
<div class="panel"> 
<p><a href="#">员工管理</a></p> 
<p><a href="#">角色管理</a></p> 
<p><a href="#">权限管理</a></p> 
</div> 
<p class="flip2">新闻管理</p> 
<div class="pane2"> 
<p><a href="#">查询新闻</a></p> 
<p><a href="#">添加新闻</a></p> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
extjs 的权限问题 要求控制的对象是 菜单,按钮,URL
Mar 09 Javascript
js实现图片拖动改变顺序附图
May 13 Javascript
Javascript基础教程之比较操作符
Jan 18 Javascript
jQuery获取标签文本内容和html内容的方法
Mar 27 Javascript
jQuery中选择器的基础使用教程
May 23 Javascript
微信小程序 教程之模板
Oct 18 Javascript
TypeScript入门-基本数据类型
Mar 28 Javascript
js原生代码实现轮播图的实例讲解
Jul 28 Javascript
浅谈React之状态(State)
Sep 19 Javascript
vue+Vue Router多级侧导航切换路由(页面)的实现代码
Dec 20 Javascript
js神秘的电报密码 哈弗曼编码实现
Sep 10 Javascript
你知道JavaScript Symbol类型怎么用吗
Jan 08 Javascript
jquery中通过过滤器获取表单元素的实现代码
Jul 05 #Javascript
jquery中获取元素的几种方式小结
Jul 05 #Javascript
JavaScript 判断日期格式是否正确的实现代码
Jul 04 #Javascript
Javascript计算时间差的函数分享
Jul 04 #Javascript
ajax 同步请求和异步请求的差异分析
Jul 04 #Javascript
Extjs EditorGridPanel中ComboBox列的显示问题
Jul 04 #Javascript
Extjs gridpanel 出现横向滚动条问题的解决方法
Jul 04 #Javascript
You might like
收音机鉴频器对声音的影响和频偏分析
2021/03/02 无线电
PHP与SQL注入攻击[二]
2007/04/17 PHP
php摘要生成函数(无乱码)
2012/02/04 PHP
php echo, print, print_r, sprintf, var_dump, var_expor的使用区别
2013/06/20 PHP
Js的MessageBox
2006/12/03 Javascript
jQuery autocomplate 自扩展插件、自动完成示例代码
2011/03/28 Javascript
javascript 进阶篇2 CSS XML学习
2012/03/14 Javascript
Node.js模块加载详解
2014/08/16 Javascript
javascript学习笔记(七)Ajax和Http状态码
2014/10/08 Javascript
基于AngularJS实现表单验证功能
2017/07/28 Javascript
JavaScript使用Ajax上传文件的示例代码
2017/08/10 Javascript
在vue项目中使用Nprogress.js进度条的方法
2018/01/31 Javascript
Vue实现active点击切换方法
2018/03/16 Javascript
详解如何在Node.js的httpServer中接收前端发送的arraybuffer数据
2018/11/11 Javascript
Vue+Webpack完美整合富文本编辑器TinyMce的方法
2018/11/30 Javascript
深入理解es6块级作用域的使用
2019/03/28 Javascript
弱类型语言javascript中 a,b 的运算实例小结
2019/08/07 Javascript
Vue中错误图片的处理的实现代码
2019/11/07 Javascript
springboot+vue+对接支付宝接口+二维码扫描支付功能(沙箱环境)
2020/10/15 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
Python 搭建Web站点之Web服务器网关接口
2016/11/06 Python
python xml.etree.ElementTree遍历xml所有节点实例详解
2016/12/04 Python
python 美化输出信息的实例
2018/10/15 Python
Python利用WMI实现ping命令的例子
2019/08/14 Python
python numpy 矩阵堆叠实例
2020/01/17 Python
PYQT5 vscode联合操作qtdesigner的方法
2020/03/24 Python
Tensorflow tf.nn.depthwise_conv2d如何实现深度卷积的
2020/04/20 Python
Python新手如何理解循环加载模块
2020/05/29 Python
利用Python pandas对Excel进行合并的方法示例
2020/11/04 Python
如何基于Python pygame实现动画跑马灯
2020/11/18 Python
耐克美国官网:Nike.com
2016/08/01 全球购物
销售主管岗位职责范本
2014/02/14 职场文书
艺术教育实施方案
2014/05/03 职场文书
2015年企业新年寄语
2014/12/08 职场文书
少先队辅导员事迹材料
2014/12/24 职场文书
win10如何快速切换窗口 win10切换窗口快捷键分享
2022/07/23 数码科技