隐藏/显示DIV - 将当前效果更改为淡入淡出 [英] Hide/show DIVs - change current effect to fade

问题描述

我目前正在使用网络教程中的以下代码来显示/隐藏DIV。它效果很好，但不喜欢这种效果。希望DIV能够淡出/淡出（或者更平滑的东西，目前DIV从右上角开始生长）。我怎样才能调整代码来做到这一点？你可以在这里 http://jsfiddle.net/Grek/w4HWn/1/ 谢谢

  function showonlyone（thechosenone）{
 $（'。textzone'）。each（function（index）{ 
 if（$（this）.attr（id）== thechosenone）{
 $（this）.show（2000）; 
} 
 else {
 $（this）.hide（2000）; 
} 
}）; 
} 
  

解决方案

只需更改 .hide（）到 .fadeOut（）和 .show（）到 .fadeIn（）

但是看一下你的例子，你可以通过使用数据属性来做得更简单。 / p>

看看这个示例。

您可能需要绝对定位或其他一些技术，因为两个div在淡入和淡出时叠加。

I'm currently using the code below found on web tutorial to show/hide DIVs. It works great but don't like the effect. Would like the DIVs to fade in / fade out instead (or something smoother, for the moment the DIVs are growing from the top-right corner). How could I adapt the code to do this? Youc ans ee it here http://jsfiddle.net/Grek/w4HWn/1/ Many thanks

function showonlyone(thechosenone) {
     $('.textzone').each(function(index) {
          if ($(this).attr("id") == thechosenone) {
               $(this).show(2000);
          }
          else {
               $(this).hide(2000);
          }
     });
}

解决方案

Just change .hide() to .fadeOut() and .show() to .fadeIn()

But looking at your example, you could do it much simpler by using data attributes.

Have a look at this example.

You may need absolute positioning or some other technique because the two divs stack up while fading in and out.

这篇关于隐藏/显示DIV - 将当前效果更改为淡入淡出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！