【发布时间】:2014-11-19 14:20:30
【问题描述】:
请帮助编写以下代码。
我在 firefox 和 ie 上收到“未定义事件”错误。
问题似乎与 event.preventDefault();
这个 css 只是关闭了下拉菜单
<style type="text/css">
.dropdown {
display: none;
opacity: 0;
}
</style>
jquery
自定义 javascript
<script type="text/javascript">
$( document ).ready(function(){
jQuery('.download-dropdown > a').click( function() {
event.preventDefault();
var $this=jQuery(this);
if (!$this.parent().hasClass('active')) {
var top=$this.parent().offset().top;
var left=$this.parent().offset().left;
jQuery('body').append($this.parent());
$this.parent().addClass('active');
$this.parent().css({ 'position': 'absolute',
'top': top,
'left': left,
'z-index': 999});
$this.parent().children('.dropdown').animate({ 'opacity': '1','height': 'toggle'});
$this.parent().animate({'height': '400'});
window.dropdown=$this;
}
else {
$this.parent().css({ 'position': 'relative',
'top': 'inherit',
'left': 'inherit',
'z-index': 1});
$this.parent().removeClass('active');
jQuery('article.contact-download > div > section > div').append($this.parent());
$this.parent().children('.dropdown').animate({ 'opacity': '0','height': 'toggle'});
$this.parent().animate({'height': '45'});
}
});
});
</script>
这是html
<article class="contact-download" data-background-height="60">
<section data-speed="0">
<div>
<div class="download-dropdown" style="height: 60px; position: relative; z-index: 1; top: inherit; left: inherit; display: inline-table"> <a style="padding-left: 25px; text-decoration:none; " href="#">click to see more</a>
<div class="dropdown">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
</ul>
</div>
</div>
</div>
</section>
</article>
【问题讨论】:
标签: javascript jquery