1

我在 Stack Overflow 上搜索了这个，找到了很多答案，但没有一个适用于我的具体目标......基本上我不知道为什么这段代码不起作用，请帮忙！非常感谢任何输入，谢谢！

div这是带有id的HTMLelementTop以及div要以动画高度显示的elementBottom

<div id="elementTop" onclick="toggle_visibility('elementBottom');" >
    <img id="thumb" src="images/davey1.png" />
    <a>davey blair</a>
</div>

<div id="elementBottom">
    <p><span style="font-weight: bold;">age: </span>29</p>
    <p><span style="font-weight: bold;">hometown: </span>Charleston,SC</p>
    <p><span style="font-weight: bold;">regular or goofy: </span>Regular</p>                                                   
    <p><span style="font-weight: bold;">years shredding: </span>lifetime</p>
    <p><span style="font-weight: bold;">other sponsors: </span>naish, chucktown</p>
    <p><span style="font-weight: bold;">favorite trick: </span>switch mobe</p>
    <p><span style="font-weight: bold;">favorite place to shred: </span>with my homies</p>
    <p><span style="font-weight: bold;">music preference: </span>all music</p>
    <p><span style="font-weight: bold;">paper or plastic: </span>hands</p>
    <p><span style="font-weight: bold;">cat or dog: </span>dogs</p>
    <p><span style="font-weight: bold;">other hobbies: </span>living life. work to live never live to work, live life.</p>
</div>

这是我正在使用的 JavaScript/jQuery 和我注释掉的 JavaScript 行，但是没有注释的 jQuery 不起作用。

function toggle_visibility(id) {
  var e = document.getElementById(id);
  if(e.style.height == 'auto') {
    // e.style.height = '0px';
    $('#' + e).animate({height:'0px'});
  } else {
    // e.style.height = 'auto';
    $('#' + e).animate({height:'auto'});
  }
}
4

2 回答 2

5

0px这行得通，但是您永远无法将其动画化，因为当它很高时您无法单击该元素：

http://jsfiddle.net/neuroflux/UYZY2/23/

剪断！

function toggle_visibility(id) {
    $(id).stop().animate({height:'toggle'}, 500);
}

$('.clicker').on('click', function() {
   toggle_visibility('#' + $(this).attr('name'));
});
于 2013-08-13T15:30:14.360 回答
1

您使用 jQuery 有时不使用，这有点奇怪。利用

var e = $('#' + id);

获取要操作的 Dom 元素。然后你可以做

e.animate();
于 2013-08-13T15:32:06.203 回答