Javascript 附加滚动页眉效果/带位置属性的过渡

我有一个标题

位置：绝对
在加载时，我需要在特定滚动时显示它，以便它工作

但问题是，我如何使用标题效果（即从上到下延迟显示）和
position:fixed
属性

代码：

CSS

JS:

{
    if (jQuery(window).scrollTop() >= 700) {
       jQuery('.iaw-header').css('position','fixed');
    });   
}

HTML

JS

因此，当站点加载时（在CSS中），标题可以有
top:-300px，当用户滚动时，您可以将标题的顶部转换（或设置）为0px，以便它从顶部向下滚动

   $(window).scroll(function () {
    var i = $('.iaw-header')
    var h = i.outerHeight(true);
    if ($(window).scrollTop() > h) {
        if (!i.hasClass('fixed')) i.hide().addClass('fixed');
    }
    if ($(window).scrollTop() >= 400) {
        i.slideDown('fast');
    } else {
        i.removeClass('fixed').show();
    }
});

在您的样式中添加一个类：

.fixed {position: fixed;top:0; left:0;width: 100%; }

也许，这不是最好的代码，但您仍然可以开始构建它并进行修改以使其更好。这是JSFIDLE链接：
请将您的代码放在帖子中，不要使用缩写。使链接可疑。我想你的意思是
位置
当你说
显示
@pablopixel是位置sorryno兄弟，我需要它绝对在顶部位置当它向下滚动到700时，它的固定位置它的所有都在工作我只是标题效果混乱再次检查我的答案。但现在标题从一开始就固定了，但我们需要它显示在700的固定位置，低于这个应该是正常的。你说的“正常”是什么意思？在绝对位置。它的工作，我只是想问一下头部效果，就像700的位置固定时，它应该出现从上到下的效果delay@AliRaza代码已更新。请检查它是否适合你。
.header { position: absolute; }

if (jQuery(window).scrollTop() >= 700) {
    $('#header').css('top', '-300px'); 
    $('#header').css('position', 'fixed'); 
    $('#header').animate({top: 0}, 1000);
} else {
    $('#header').animate({top: '-300px'}, 1000, function () {
        $('#header').css('top', 0); 
        $('#header').css('position', 'absolute'); 
    });
}

   $(window).scroll(function () {
    var i = $('.iaw-header')
    var h = i.outerHeight(true);
    if ($(window).scrollTop() > h) {
        if (!i.hasClass('fixed')) i.hide().addClass('fixed');
    }
    if ($(window).scrollTop() >= 400) {
        i.slideDown('fast');
    } else {
        i.removeClass('fixed').show();
    }
});

.fixed {position: fixed;top:0; left:0;width: 100%; }