2012-01-03 65 views
2

我有一个DIV,它是一个横幅,显示屏的前25像素宽度为100%。它在加载时会淡入视图中,并可通过单击末尾的十字来删除。它被设置为使用JQuery滑出视图。但是,内容不会随着它滑走,它们就会消失。我是否需要将相同的jquery附加到嵌套的DIV以确保它们正确动画?DIV内容不能正常滑动

目前使用这个jQuery:

<script type="text/javascript"> 
/* The fade in script */ 
$(document).ready(function(){ 
$('#alert_top').delay(2000).fadeIn(300); 
}); 
/* The fade out script */ 
$(function(){ 
$(".alert_topClose").click(function(){ 
    $("#alert_top").slideUp(300, function(){ 
     $(this).remove(); 
    }); 
}); 
}); 
</script> 

这里是伴随HTML

<div id="alert_top"> 
<div class="alertcontainer"> 
    <div class="alertcontent alertstyle">Text</div> 
    <div class="alertclose alertstyle"><a class="alert_topClose"><img src="cancel_cross_14x14_white.png" /></a></div> 
</div> 
</div> 

http://jsfiddle.net/2J7qP/

+1

请过帐HTML。 – Alex 2012-01-03 16:59:27

+1

您可以在http://jsfiddle.net – Pavan 2012-01-03 17:01:57

+0

重现与HTML编辑。我将在JSFiddle上发布它。 – Andy 2012-01-03 17:04:49

回答

1

有你提供了CSS的小问题。我固定的他们,在FireFox,IE,Chrome和Safari浏览器进行测试,它现在看起来很好:

我改变你的固定大小要灵活取决于屏幕的宽度并把你的关闭div内部警报。我改变了关闭按钮div的顺序,因为我想使用float:right。请让我知道,如果您有任何关于此问题:-)