Question

我有一个DIV，它是展示前25px的100％宽的横幅。它会在加载时淡入视图，可以通过单击末尾的十字来删除。它被设置为使用JQuery滑出视图。但是，内容不会随之滑落，它们就会消失。我是否需要将相同的jquery附加到嵌套的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/

Answer 1

您提供的CSS存在小问题。我修复了它们并在FireFox，IE，Chrome和Safari中测试它现在看起来很好：

新更新：http://jsfiddle.net/42qWt/

我将固定大小更改为灵活取决于屏幕宽度，并将您的close div置于警报范围内。我更改了关闭按钮div的顺序，因为我想使用float：right。如果您对此有任何疑问，请与我们联系： - ）

DIV内容无法正常滑动

1 个答案: