Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- .book-now-dropdown {
- text-align: right;
- @media screen and (max-width: 1090px) {
- text-align: center;
- }
- height: 40px;
- width: 100%;
- right: 0px;
- position: absolute;
- top: 70px;
- background-color: $b-green;
- transition: 0.2s;
- overflow: visible;
- max-width: 875px;
- transition: top 350ms ease-in-out;
- &.hidden {
- height: 0;
- transition: 0.8s;
- overflow: hidden;
- }
- }
- // JS
- window.onscroll = function() {myFunction()};
- // Get the navbar
- var booknow = $("#book-now");
- var position = booknow.position();
- console.log(position);
- // Get the offset position of the navbar
- var sticky = booknow.offset().top;
- // Add the sticky class to the navbar when you reach its scroll position. Remove "sticky" when you leave the scroll position
- function myFunction() {
- var position = booknow.position();
- if (window.pageYOffset >= sticky) {
- booknow.addClass("sticky")
- } else {
- booknow.removeClass("sticky");
- }
- }
- <div class="book-now-dropdown" id="book-now">
- <div id="lodging_box">
- <div id="jrs-widget"></div>
- <script type="text/javascript">
- (function() {
- var script = document.createElement('script')
- script.type = 'text/javascript';
- script.src = "https://admin.bookdirect.net/hs4/widgets/1283.js?widget_element=jrs-widget";
- document.body.appendChild(script);
- })();
- </script>
- </div>
- <div class="book-now-button">
- <a href="#">Search Rooms</a>
- </div>
- </div>
- .sticky {
- position: fixed !important;
- top: 0px !important;
- width: 100% !important;
- max-width: 875px !important;
- left: 425px !important;
- // width: 100%
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement