我的固定菜单导航标题不会保留在其包含的div中。是否是响应问题?

好吧,我无法想象我的生活。 我花了几天时间。

我有一个jquery片段,它在一个相对位置取一个导航栏,并在点击屏幕顶部时将其切换到固定位置。 我在其他网站上工作正常,但在我有不同屏幕尺寸的网站上,导航栏向左或向右滑动。 我的屏幕尺寸更大或更小。

这是网站。 http://curtisj.trafficflo.net/

如何让导航标题保留在容器div中以获取网站内容?

这里是一个jsfiddle,但我不知道如何使用我的jquery小提琴。

jsfiddle的代码

这是jquery的代码……我不知道jquery是否是问题。

// JavaScript Document /* jQuery(document).ready(function(){ if(jQuery('header,div,p,span,h1,h2,h3,h4,a').hasClass('isa-scroll-fixed')){ var el = jQuery('.isa-scroll-fixed'), elTop = jQuery(el).offset().top; elLeft = jQuery(el).offset().left; //alert(elTop); jQuery(document).scroll(function(){ var height = jQuery(window).height(); var scrollTop = jQuery(window).scrollTop(); if(scrollTop>=elTop){ //add fixed jQuery(el).addClass('scroll_fixed').css("left",elLeft+"px"); }else{ //clear fixed jQuery(el).removeClass('scroll_fixed').attr('style',''); } }) } }) */ // JavaScript Document /* jQuery(window).load(function(){ if(jQuery('header,div,p,span,h1,h2,h3,h4,a').hasClass('isa-scroll-fixed')){ var el = jQuery('.isa-scroll-fixed'), elTop = jQuery(el).offset().top; elLeft = jQuery(el).offset().left; //alert(elTop); var scrollTop = jQuery(window).scrollTop(); scrollFixed(el,elTop,elLeft); } }) */ var setInter = null; var session = null; setInter = setInterval(function(){ if(jQuery('header,div,p,span,h1,h2,h3,h4,a').hasClass('isa-scroll-fixed')){ var el = jQuery('.isa-scroll-fixed'); session = jQuery(el).attr('set-scroll'); //alert(session); if(session == '2'){ jQuery(el).attr('set-scroll','2'); }else{ jQuery(el).attr('set-scroll','1'); } if(session == '1'){ setValue(el); } } }, 200); function setValue(el){ var setScroll = jQuery(el).attr('set-scroll'); elTop = jQuery(el).offset().top; elLeft = jQuery(el).offset().left; //alert(elTop); jQuery(el).attr('set-scroll','2'); scrollFixed(el,elTop,elLeft); }; function scrollFixed(el,elTop,elLeft){ jQuery(document).unbind('scroll').scroll(function(){ //alert(elTop); var height = jQuery(window).height(); var scrollTop = jQuery(window).scrollTop(); if(scrollTop>=elTop){ //add fixed jQuery(el).addClass('scroll_fixed').css("left",elLeft+"px"); }else{ //clear fixed jQuery(el).removeClass('scroll_fixed').attr('style',''); } }) } 

将所有东西包裹在container

另外, contentSection_interactive 之外div上使用absolute positioning

我希望我可以重现,但你有很多插件正在进行,你没有生成codefiddle

一旦你这样做,这里可以提供帮助。

常见的全尺寸DIV

  • 宽度:100%;
  • hright:100%;
  • 位置:绝对的;

header.navbar是固定值。

您必须使用@media更改不同屏幕尺寸的值。