How to do navbar slidedown and slideup when der scroll on page

Asked

Viewed 155 times

0

Hello, I’m a beginner in jQuery and I’m trying to configure the navbar of my site so that when you scroll down, the navbar hides and there is only one button for you to open the navbar, and when you scroll up until the maximum that button is invisible. I wonder how this can be done.

The navbar div is as follows:

<div id="menu" class="navbar navbar-default navbar-fixed-top" role="navigation" style="height:170px;">
  <div class="container">
    <div class="navbar-header">
      <h1><svg id="logo" xmlns="http://www.w3.org/2000/svg" width="120px" height="140px" viewBox="0 0 992.32 807.5"><defs><style>.cls-1{fill:#124466;}.cls-1,.cls-2,.cls-3{fill-rule:evenodd;}.cls-2{fill:#ea7f0a;}.cls-3{fill:#fff;}</style></defs><path class="cls-1" d="M952.54 373.61c-61.84-56.16-124.37-113-186.35-168.29-52.16-46.55-103.37-93.95-155.13-140.15C580.19 37.63 551.42 4.28 498.76 0h-3.37C460.58 2.86 435.33 18.66 414 37s-41.33 37.85-62.11 56.28c-41.77 37.17-83.07 74.69-124.57 112.34-40.9 37.15-83.69 74.32-124.84 112-20.32 18.66-41.16 37.93-62.09 56.3C19.32 392.41 2.1 416.52.32 452.28H0v8.26c4.18 42.44 25.79 67.43 70.38 69.46v.61c-1.76 57.31 1.39 118.75-.92 176.56-2.37 59.4 22 97.21 77.41 100.36h704.39c40.7-3.49 61.85-26.93 70.07-61.5 2.89-12.16 3.37-25.09 3.37-40.7 0-57.66-.84-117.7-.61-175 44.52-1.68 64-28.42 68.24-70.38v-8c-2.08-35.59-18.95-59.41-39.79-78.34z"/><path class="cls-2" d="M907.87 436.34c-.23-4-5.11-7.88-8.87-11.32-39.16-35.85-78.32-71.35-117-106.77l-24.57-22.48c-3.37-3-6.75-6-10-9.12l-140.11-128.2c-31.82-29.04-63.74-58.17-95.4-87.17-4.72-4.31-9.75-12.07-16.52-11.32-4.51.5-10 7.15-14.69 11.32s-9 8.39-12.85 11.93c-94.78 86.31-190.74 170.53-285.18 257.34-29.15 26.8-60.39 55.18-90.57 82-4 3.56-11.33 8.65-11.93 12.85-1.74 12.15 12.29 9.79 23.25 9.79h53.89v245.4c0 11-1.65 23.36 9.49 22 8.77-1 7-10.7 7-21.73V451.33c0-6 .88-12.31-.31-16.83-1.89-7.24-9.91-5.81-19-5.81h-44.04C235.96 314.52 364.08 199.28 490.5 85.06c1.9-1.71 5.52-5.53 6.12-5.51s4.27 4.09 5.81 5.51c34.12 31.36 147.8 135.07 171.66 157l.57.52c2.7 2.47 5.53 4.82 8.11 7.42l96 87.85c30.13 27.54 60.36 55.11 90.25 82.26a60.38 60.38 0 0 1 8.26 8.57h-24.8c-7.89 0-18.6-1.68-24.48.61-6.4 2.5-5.2 10.13-5.2 19.89 0 81.12-.62 159.9-.61 240.51 0 6.24-.89 13.44.31 17.14 2.41 7.43 13.33 6.55 15.61 0 1.43-4.11.61-10 .61-15.61 0-16.18.31-34.41.31-49.26 0-66.19.21-133 .61-196.75h47.12c10.75 0 21.7 1.48 21.11-8.87z"/><g id="casa"><path id="c" class="cls-3" d="M434.81 490.8c-6.53 8.39-18.94-4.74-27.84 2.75-7.06 5.94-7.47 21.2-1.84 27.23 2.41 2.58 6.34 4.08 11.32 3.67 5.88-.48 14.39-6.58 18.36.31-14.42 16.69-48 8.79-47.73-17.14a25.87 25.87 0 0 1 23.56-25.7c11.45-1.07 18.68 3.26 24.17 8.88z"/><path id="a" class="cls-3" d="M477.95 502.13c-.45-7.71-5.35-11.23-13.46-10.4-7 .72-15.31 5.83-18.67-1.22 4.91-4.92 10.34-8.47 18.36-9.18 18.52-1.63 28.77 9.72 29.07 24.79.38 19-13.66 30.07-30.9 28.15-9.48-1.06-22.57-8.71-17.75-22.34 3.58-10.12 20.36-13.08 33.35-9.8zm-20.81 13.46c-2.3 10 13.13 10.7 18.05 4.9 2.18-2.57 2.65-5.58 3.06-9.18-7.18-1.69-19.56-2.43-21.1 4.28z"/><path id="s" class="cls-3" d="M542.52 491.72c-4.64 7.57-13.82-1.69-22.34-.92-2.48.22-4.42 1.18-4.59 3.37-.37 4.8 8.79 6.62 12.85 8.26 8.17 3.31 20.71 10.57 13.77 22.34-7.48 12.69-34.93 10.61-41.61-1.22 5.15-7.18 13.15 1.26 22.64.92 3.91-.14 8.15-1.17 8.26-4.9.07-2.44-3.23-5.13-5.51-6.43-7.64-4.34-19.28-6.15-22-13.77-4.16-11.52 6.93-17.77 16.83-17.75s17.55 4.66 21.7 10.1z"/><path id="a-2" data-name="a" class="cls-3" d="M584.44 502.13c-.76-4.65-2.24-7.91-5.51-9.49-8.47-4.1-21.89 6.79-26.62-2.14 5.8-6 13-10.23 25.09-9.18a24.32 24.32 0 0 1 22 22c.8 8.18-.86 17.66-8 24.17-11.6 10.79-42.43 9.79-41.23-11.29.79-13.92 18.85-17.56 34.27-14.07zm-21.11 15a6.73 6.73 0 0 0 4.28 6.43 12.74 12.74 0 0 0 17.13-12.28c-7.78-1.72-21.04-2.62-21.42 5.84z"/></g><g id="dupet"><path id="d" class="cls-2" d="M319.15 484.99c.21 6-.47 12.3-.92 18.67-1.35 19.22-.61 39.91-.61 60.89 0 26.87 2.51 56.67-6.12 75.89-8.54 19-23 31.68-46.51 35.49-44 7.13-73.66-20.86-75.58-61.5-1.67-35.29 18.6-60.66 46.2-68.24 14.71-4.05 34.71-2.91 47.71 4.59-.3-12.7-1.56-25.51-.61-35.8 1.73-18.53 14.83-30.32 36.44-29.99zm-79.83 85.37c-15.92 8.38-23.41 45-14.08 65.48 5.58 12.25 22.65 22.49 39.47 15.3 19.86-8.5 26.32-52.87 11.93-71.91a30.43 30.43 0 0 0-27.85-11.32 27.05 27.05 0 0 0-9.47 2.45z"/><path id="u" class="cls-2" d="M453.17 544.35c-4.42 32.84 3.09 68.8-6.12 94.24-8.32 23-28.57 40.75-61.5 38.25-29.34-2.23-47.48-20.52-55.38-45-4-12.52-3.67-30.83-3.67-46.51 0-16.42 4.06-28.58 14.38-35.49 5.44-3.64 13-4.6 21.11-5.51 2.1-.24 1.22 2.41.92 6.12-1.3 15.86-1.22 35.3-1.22 52.94 0 21.51 3.52 39.51 15.61 46.51 6 3.47 16.89 4.12 23.87.61 12.72-6.4 15.3-26.37 15.3-44.06 0-15-1.56-31.8 3.37-43.14 5.01-11.58 15.48-19.16 33.33-18.96z"/><path id="p" class="cls-2" d="M495.7 670.11c4 31.49-5.71 53.9-36.11 52.94 1.41-18.89 1.84-39 1.84-59.06 0-20.79-1.29-41.67.31-60.89 2.25-27 16.78-45.76 37.64-54.16a71.49 71.49 0 0 1 26.62-5.2c23.33-.17 40.71 9.66 50.79 23.87s16.5 36.73 11 59.67a65 65 0 0 1-32.13 42.53c-14.47 8.06-42.99 10.86-59.96.3zm16.83-99.45c-16.39 9.29-24 48.16-11.93 68.24 6.2 10.31 23.14 19.44 38.55 11.93 18.65-9.08 24.7-50.53 11.93-70.38-5.33-8.29-15.48-13.9-28.15-12.55-4.68.51-7.82 1.3-10.4 2.77z"/><path id="e" class="cls-2" d="M632.48 622.99c1.12 21.52 15 33.19 37.94 29.37 11.09-1.85 23.66-9.11 34-5.2 3.64 1.38 6.45 5 8.26 8a63.38 63.38 0 0 1-30.9 19.28c-13.9 4-31.38 3.59-44.06-.61-24-7.93-39.36-30.33-39.47-60.89-.14-39.3 22.28-64.64 57.53-68.85 28.75-3.43 53.89 9.21 60.59 29.37 4.72 14.2.45 29.84-8 38.25-14.71 14.66-49.05 19.57-75.89 11.28zm25.4-64.87c-.75 11-14.64 11.93-13.16 23.56 2.07 0 4.25-.17 4.59 1.53-2.74.53-5 1.5-7.65 2.14-3.93-3.68-11.75-2.88-18.67-3.67-5.37-.62-11-2.91-15.3 0a21.45 21.45 0 0 0 11.32 5.51c4.56.59 11.53.33 11.63 4.28 0 1.41-4.15 5.36-5.2 6.73-3.42 4.46-7.28 10.49-3.67 16.83 9.57-4.08 15.63-17.81 27.84-19.28 6.3-.76 9.72 2.28 15.91 1.84 1.31-.09 2.23-1 3.67-.31-4.9 3.14-10.59 5.47-11.32 12.85a27.49 27.49 0 0 0 1.22 10.1 51.44 51.44 0 0 0 11.63-14.38c1.51.63 1.19 3.1 1.84 4.59 2-2.28 2.93-7.55 1.53-11.32 12.6-3.11 24.7-6.71 30.9-16.22.55-.77 2-.64 2.45-1.53-1.72-1-1.53-1.92-.61-3.67-5.37-4.24-12.53-10-22.34-8.87-3.42.39-7.09 2.09-11 2.14-4.09-5.7-8.49-11.09-15.61-13.77v.92z"/><path id="t" class="cls-2" d="M720.6 486.21c32.94-1 40 23.86 37.64 58.14 12.86.62 27.33.2 38.86-1.53.84 24-14.9 31.41-38.86 30.6.54 28-3.56 60.21 12.24 73.13 6.94 5.68 22.27 7 33 2.45 4 19.28-11.59 28.15-27.23 28.46a45.7 45.7 0 0 1-26.93-8.27c-13.78-9.39-23.09-25.19-26-44.37-1.6-10.55-1.22-22.11-1.22-34 0-34-.67-71.43-1.53-103.73.1-.48-.49-.75.03-.88z"/></g><g id="cuidado"><path id="c-2" data-name="c" class="cls-3" d="M255.5 707.44c-4.44 3.76-9.2-.43-15-.31a18.55 18.55 0 0 0-18.36 16.52c-1.48 13.19 3.79 25.54 18.05 26 5.77.19 11.62-4.43 15.3 0-3.44 3.83-7.87 5.85-13.46 6.43-20.13 2.08-32.13-13.49-30.9-30.6 1-13.62 10.71-23.46 24.79-24.78 8.86-.82 15.79 1.78 19.58 6.74z"/><path id="u-2" data-name="u" class="cls-3" d="M266.21 719.99c1 9.64-3 34.35 10.71 29.07 10.2-3.94-2-30.58 15-29.07.22 19.86.43 37.22-18.67 36.11-8.59-.5-15.64-7.47-16.52-16.83s-.41-19.23 9.48-19.28z"/><path id="i" class="cls-3" d="M304.77 719.07c-.5 11.36-.5 24.74 0 36.11-2.6-.06-5.93-.7-7.65-2.45-3.51-3.56-3.88-27.2 0-31.21 1.75-1.81 4.65-2.44 7.65-2.45z"/><path id="_." data-name="." class="cls-3" d="M298.32 703.16c3.94-.85 5.89.86 6.43 3.06 2.13 8.79-13.3 10.5-10.71.31.34-1.25 1.82-2.84 4.28-3.37z"/><path id="d-2" data-name="d" class="cls-3" d="M342.4 701.63c-2.87 15.46 3.84 40.22-5.51 49.57-6.4 6.4-20 6.71-26.31-.61-12.13-14 2.64-39 21.73-29.68-.39-8.98-.77-20.55 10.09-19.28zm-15.91 47.73c9.4-2.8 8.6-25.11-3.67-23.56-11.83 1.48-9.71 27.55 3.67 23.56z"/><path id="a-3" data-name="a" class="cls-3" d="M367.8 733.45c-.69-3.89-2.22-6.64-5.51-7.34-5.75-1.22-14 5.19-16.83-.92a19.73 19.73 0 0 1 14.69-6.73c11.6-.18 17.32 7.56 18.05 16.52 1 12.34-7 21.64-18.67 21.73-8.47.06-19.7-6.58-14.69-17.14 2.95-6.19 12.64-8.19 22.96-6.12zm-13.48 14.38c4.52 4.42 14.8-.45 13.46-7.65-5.46-3.58-20.02 1.24-13.46 7.65z"/><path id="d-3" data-name="d" class="cls-3" d="M414.92 701.63c-2.87 15.47 3.85 40.22-5.51 49.57-6.4 6.4-20 6.72-26.31-.61-11.87-13.68 2.12-39.36 21.73-29.68-.41-8.99-.75-20.52 10.09-19.28zm-15.91 47.73c9.41-2.8 8.61-25.11-3.67-23.56-11.83 1.48-9.71 27.55 3.67 23.56z"/><path id="o" class="cls-3" d="M432.67 719.38c12.22-1.55 22.49 7.28 20.5 21.42-3 21.3-36.89 19.47-36.72-3.37.08-10.35 7.36-16.93 16.22-18.05zm-.92 29.68c13.7 5.64 16.72-25.22 2.14-23.26-9.17 1.24-9.98 20.03-2.14 23.26z"/></g><g id="completo"><path id="c-3" data-name="c" class="cls-3" d="M530.89 725.19c-4.61 6.09-10.81-1.62-17.44.92-8.06 3.09-7.45 20-.31 22.95 6.92 2.83 13.44-5.41 17.75.61-11.5 12.82-35.17 5-33-14.69 1.57-15.01 22.43-21.37 33-9.79z"/><path id="o-2" data-name="o" class="cls-3" d="M546.8 719.38c7.74-1 14.94 3 17.75 7.34a35.62 35.62 0 0 1 2.75 7c2.25 16-12.68 27.52-26.93 20.5-6.53-3.22-12.65-13-8.57-23.56a19 19 0 0 1 15-11.28zm4.9 30c8.73-2.8 8.29-25.21-3.67-23.56-11.03 1.46-9.71 27.83 3.67 23.54z"/><path id="m" class="cls-3" d="M598.82 723.97c5.91-7 20.53-5.77 25.7.92 5.77 7.46 2.64 19.65 4.28 30.29-17.93 1.82-3.64-28.89-17.14-29.68-11.58-.68-7.82 18.62-8 29.68-16.43 2-5.42-25-14.69-29.07-12.8-5.64-11.37 18.07-10.4 29.07-6.09-.13-9.38-3-10.1-8.26-1.74-12.63 3-26.61 15.61-27.85a18.66 18.66 0 0 1 14.74 4.9z"/><path id="p-2" data-name="p" class="cls-3" d="M640.43 754.28c.4 9 .68 20.44-10.1 19.28 2-18.88-4.28-43.74 8-51.71 12.88-8.39 29.11 1.75 28.15 17.14a18.08 18.08 0 0 1-26.05 15.29zm11-4.9c6.34-1.89 8.59-16.81 3.06-21.73a8.24 8.24 0 0 0-6.73-1.84c-11.65 1.41-10.09 27.66 3.69 23.55z"/><path id="l" class="cls-3" d="M668.32 701.63c18.69-.71 5.11 31.58 11.32 43.45 2.26 4.32 8.56 5.46 14.08 3.67 1.14 6.61-4.56 7.85-9.79 7.34a19.53 19.53 0 0 1-11.63-6.12c-7.66-9.51-2.24-32.78-4.28-47.43-.07-.43-.1-.86.3-.91z"/><path id="e-2" data-name="e" class="cls-3" d="M702.55 741.1c.62 5.13 2.77 8.24 7.34 8.57 5 .36 11.7-4.81 14.69 0-4.85 7.83-19.72 8.38-26.31 2.14-11.25-10.64-3.79-31.09 10.1-32.74 10.08-1.19 18.77 3.1 18.05 12.85s-13.39 11.53-23.87 9.18zm15.3-12.55c-2.57-6.77-17.73-2.05-15.3 6.73 6.46 2.41 18.24 1 15.3-6.72z"/><path id="t-2" data-name="t" class="cls-3" d="M738.04 719.07c3.65 0 7.53.19 10.4-.61 1.08 6.08-4.2 8.44-10.4 8.26-.91 11.82-.46 26.5 12.24 21.73 1.36 5.24-2.92 7.51-7 7.65-20.2.68-14.45-29.08-15.61-48.35a.47.47 0 0 0-.31-.61c7.22-.92 10.96 4.32 10.68 11.93z"/><path id="o-3" data-name="o" class="cls-3" d="M766.5 719.38c15.35-2.12 25 12.61 19.28 26-4.64 10.84-22.56 15.94-31.52 4-9.49-12.69-.57-28.23 12.24-30zm4.9 30c6-1.81 8.38-16.68 3.06-21.73a7.9 7.9 0 0 0-6.73-1.84c-11.23 1.71-9.29 27.47 3.67 23.55z"/><path id="_.-2" data-name="." class="cls-3" d="M793.73 745.08c8.23-1.13 7.29 11.35-.61 10.4-5.5-.66-5.94-9.5.61-10.4z"/></g><g id="animais"><path class="cls-3" d="M732.1 295.07a137.49 137.49 0 0 1-14.08 15c-.58 21.9 3 39.65 5.51 58.44-5-1.87-6.17-6.83-8.57-12.24-.8-1.8-2.38-4.84-3.37-7s-1.93-6.22-4-6.12c-2.44.12-3.53 8.88-4.28 11.32-1.4 4.57-2.07 8.15-5.51 9.79 1-3.84 2.62-8.58 1.53-13.46-2.47.37-3.45 3.5-5.2 5.51s-3.33 4.65-7 4.28c1.19-6.77 10.19-14.21 6.11-23.31-5.36 2.19-5.88 10.85-11.63 11.63.24-6.47 3.24-11.72 5.51-17.44 2-5.16 6-11.89 5.81-17.75-.11-3.94-3.15-9.49-4.59-13.77-4.46-13.27-7.73-30.62-2.45-46.51 1.31-7.28 7.34-16.83 7.34-16.83 2.66-5.61 9.75-13.3 15-19.58-5.09 1.57-13-7.54-13.77 1.53-4.61-1.41-6.74-7.92-5.2-13.16 1.14-3.89 5.5-6 8.57-7.34-2.22-12.37 21.26-16.92 30.6-11.32 22.54 13.51 27.72 66.8 12.86 92.88a122.84 122.84 0 0 1-9.19 15.45zM524.46 286.71a50.86 50.86 0 0 1 15.91 13.46c6.33.2 13.88-.83 17.75 1.84 3.17-1.72 4.44-5.35 5.81-8.87 1.32 3.84.82 7.8 1.84 11.32.58 2 2 4 2.75 6.12 2.18 6.24 2.86 15.09 5.51 21.11 2.87 6.52 10.23 11.17 17.75 12.55 6.43 1.18 11.32 1.35 16.22 3.06 13.73 4.81 23.49 14.23 30.9 26.31 9.12 14.86 14.33 37.1 10.4 63.34 6.35 1.4 13.46 1.53 20.19 1.53 14.17 0 26.95 2.81 38.55 6.12 6 1.7 12 4.05 18.36 3.67 8.47-.51 14.62-4.21 20.5-8 1.7-1.08 4.11-3.34 6.43-1.22.94 3.43-2.47 5.46-4.28 7-5.82 5.06-14.55 10.27-24.17 11-9.18.71-16.69-1.67-25.4-4.28-24.79-7.44-52.81-3.93-74.36 6.12-3.68 1.72-7.35 4.65-12.55 5.2a34.14 34.14 0 0 1-15.3-2.14c-3.82-1.49-8.24-4.25-13.46-4-3 .16-5.58 1.65-8.26 1.84-8.41.59-14-3.26-18.67-7.65-4.41 5.49-20.93 4.09-20.2-5.51.36-4.64 6.57-6.18 8-9.49 1.3-3.1 1.53-10.65 1.53-14.38a63.41 63.41 0 0 0-5.2-24.17c-2.82-6.57-7.43-12.46-10.1-19-4.08-9.95-2.32-22.25-.92-34.27-2.17-2.38-5.38-3.61-7.65-6.43-2.45-3-5.09-8.8-4.28-13.46.44-2.56 4.25-5.48 6.43-8s5-5.06 5.51-8.57c1.22-8.92-3.52-14.24-5.54-22.15zM389.22 222.15c-7.14 2.85-10.61 11-14.69 15.91-1.83-14.12 3.51-24.08 8.57-33.66 4.73-9 11.11-19.19 19.58-23.56a61.68 61.68 0 0 1 21.42-6.12 36.45 36.45 0 0 1 19.28 3.67c2.8 1.37 6.61 5 10.1 5.51 1.89.29 4.28-.45 6.73-.61 6.39-.42 14.56-.51 20.2-1.53 2.4-.44 4.7-2.07 7-1.22 1.85 6.64 3.43 15.46 0 22.95-5 10.83-16.3 20-27.84 22.95 1.24 14.57-.81 28.31-5.51 37.94 6.43 16.11 17.5 31.31 16.52 54.47-.28 6.57-2.5 12.42-4 19.58-1.59 7.69-1.3 16.43-1.84 24.79-1.29 20.19-1.92 43.6.61 63.65.5 3.92.81 8.7 1.84 11.32 1.27 3.24 5.73 5.19 7.65 8.26 1.28 2 3.08 5.85 2.75 8.87-.5 4.63-9.85 11.5-17.14 10.71-3.46-.37-12-4.64-13.16-7.65-.71-1.9.08-4.38 0-6.43-.2-5.21-1.94-11.19-2.75-17.14-1.53-11.17-3.12-23.45-3.67-35.49-.26-5.72 1.15-12.48-2.75-16.83-4.36 1.29-5.08 6.77-6.43 11-3.52 11.12-10 31.55-4.59 45 1.7 4.22 6 8 9.49 11 3 2.66 9.45 6.78 8 11.93-1 3.39-7.68 5-12.55 5.2-9.69.31-16.59-3.42-22.34-7-3.74.86-6.82 2.31-11 1.84-3.41-.39-6.1-2.37-9.18-2.45-4.81-.12-10.14 2.39-15.3 3.37-17.32 3.27-33.84.17-45.59-7-26.38 7.83-74.55 9.71-78-19.89-.37-.35-.12-.78 0-.31 12.85 16.57 54.4 18.19 72.21 4 2.34-1.87 6-4.94 6.43-7 .51-2.63-1-6.25-1.22-9.18-1.15-16.65 1.88-32.34 6.12-45.29 1.71-5.22 4.11-9.93 5.81-15 2.52-7.46 4.1-14.8 7-21.73 7.11-16.74 16.77-29.88 25.7-45.9 1.79-3.21 4.39-6.68 4.9-9.18.79-3.93.28-7.63.92-11a50.84 50.84 0 0 1 2.45-9.18c2.25-5.77 5.63-9.45 8.87-14.08-.39-9.75-1.43-19.55-.6-29.49z"/></g></svg></h1>
    </div>    
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li>
          <a href="index.php" title="Home"><span data-hover="Home">Home</span></a>
        </li>
        <li>
          <a href="produtos.php" title="Prices"><span data-hover="Produtos">Produtos</span></a>
        </li>
        <li>
          <a href="servicos.php" ><span data-hover="Serviços">Serviços</span></a>
        </li>
        <li>
          <a href="sobre.php" title="About us"><span data-hover="Sobre">Sobre</span></a>
        </li>
        <li>
          <a href="contato.php" title="Contact us"><span data-hover="Contato">Contato</span></a>
        </li>
      </ul>
    </div>
  </div>
</div>

1 answer

1

In the scroll event, you compare the navbar height to the scroll position. If the scroll position is greater than the navbar height, you hide it, otherwise it displays.

$(document).scroll(onScrollBody);
function onScrollBody() {
    var currentScrollTop = $('body').scrollTop();
    //testar aqui se o a posição do scroll já é suficiente para esconder     
    //poderia ser assim, por exemplo:
    if(currentScrollTop > $('#menu').height()){
        $('#menu').hide();
    }
    else { $('#menu').show(); }
}       

jquery scrollTop

I didn’t test it, maybe I need some adjustments, but here’s the idea.

And it might make more sense for you to remove this Fixed style from the navbar, so it will normally go up along with the rest of the scroll page. Then you test the height of the scroll as in the example above and do not need to hide the navbar, because it has already disappeared naturally, you only display the quoted button and then do the opposite movement, when the height of the scroll is less than the height of the navbar, you hide the button.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.