研究了一下toggle之click触发DIV的显示与隐藏,现在把代码发上来。

HTML代码:

<input type="button" )来删除。 </p>
</div>

JQuery代码:

完整版:

<script src="http://www.classd.cn/javaScript/jquery.js"></script>
<script language="javascript">

$(

function(){

$("#btn").toggle(

function(){$(this).click(function(){$("#content").hide();})},
function(){$(this).click(function(){$("#content").show();})}

);

}

)
</script>

 

简写版(推荐)

 

<script src="http://www.classd.cn/javaScript/jquery.js"></script>
<script language="javascript">

$(function(){

$("#btn").toggle(

function(){$("#content").hide();},
function(){$("#content").show();}

);

})
</script>

 

使用jQuery toggle时,点击后会闪一下,DIV才出来
悬赏分:15 | 解决时间:2010-9-11 15:21 | 提问者:kekelin2008
<div >
      <img src="${ctx }/images/face.png" height="20"  onclick="Effect.toggle('font_div','slide'); return false;" />
</div>
<div >
<ul>
<li>
<a style="color: black; font-size: 10px" href="#" onclick="NYSfont2('black');return false;">■</a>
</li>
</ul>
<div>
程序如上,我想点击一个图片实现font_div隐藏与显示,但是实际情况是当我点击了这个图片后font_div部分不是很顺利的就显示出来,而是先把整个font_div显示出来,然后又重新慢慢显示。就像是闪了一下,再实现我要的效果!隐藏的时候也是一样,先慢慢的隐藏,当隐藏完之后紧接着又闪一下。不知道这是怎么回事?请指教!!!!

问题补充:

问题解决了,就因为在文件里少了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
加上这一行就一点问题没有了!
最佳答案
给你一个简单的例子吧,应该能达到你要的效果。

<!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-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="jquery.js"></script>
<script>
$(function(){
 $("#shift").click(function(){
$("p").slideToggle("slow");
   });
});
</script>
</head>

<body>

<div >
<input type="button"  />

<p style="display:none">我想点击一个图片实现font_div隐藏与显示,但是实际情况是当我点击了这个图片后font_div部分不是很顺利的就显示出来,而是先把整个font_div显示出来,然后又重新慢慢显示。就像是闪了一下,再实现我要的效果!隐藏的时候也是一样,先慢慢的隐藏,当隐藏完之后紧接着又闪一下。不知道这是怎么回事?请指教!!!!</p>
</div>


</body>
</html>

相关文章:

  • 2021-06-12
  • 2021-11-05
  • 2022-12-23
  • 2022-12-23
  • 2021-12-23
  • 2022-12-23
猜你喜欢
  • 2021-12-18
  • 2022-12-23
  • 2022-12-23
  • 2021-12-18
  • 2022-01-29
  • 2022-02-11
相关资源
相似解决方案