Advertisement
mr_grembly

Untitled

Mar 18th, 2018
200
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.15 KB | None | 0 0
  1. .book-now-dropdown {
  2. text-align: right;
  3. @media screen and (max-width: 1090px) {
  4. text-align: center;
  5. }
  6. height: 40px;
  7. width: 100%;
  8. right: 0px;
  9. position: absolute;
  10. top: 70px;
  11. background-color: $b-green;
  12. transition: 0.2s;
  13. overflow: visible;
  14. max-width: 875px;
  15. transition: top 350ms ease-in-out;
  16. &.hidden {
  17. height: 0;
  18. transition: 0.8s;
  19. overflow: hidden;
  20. }
  21. }
  22. // JS
  23. window.onscroll = function() {myFunction()};
  24.  
  25. // Get the navbar
  26. var booknow = $("#book-now");
  27. var position = booknow.position();
  28. console.log(position);
  29. // Get the offset position of the navbar
  30. var sticky = booknow.offset().top;
  31.  
  32. // Add the sticky class to the navbar when you reach its scroll position. Remove "sticky" when you leave the scroll position
  33. function myFunction() {
  34. var position = booknow.position();
  35.  
  36. if (window.pageYOffset >= sticky) {
  37. booknow.addClass("sticky")
  38. } else {
  39. booknow.removeClass("sticky");
  40. }
  41. }
  42.  
  43.  
  44. <div class="book-now-dropdown" id="book-now">
  45. <div id="lodging_box">
  46. <div id="jrs-widget"></div>
  47. <script type="text/javascript">
  48. (function() {
  49. var script = document.createElement('script')
  50. script.type = 'text/javascript';
  51. script.src = "https://admin.bookdirect.net/hs4/widgets/1283.js?widget_element=jrs-widget";
  52. document.body.appendChild(script);
  53. })();
  54. </script>
  55. </div>
  56. <div class="book-now-button">
  57. <a href="#">Search Rooms</a>
  58. </div>
  59.  
  60. </div>
  61.  
  62. .sticky {
  63. position: fixed !important;
  64. top: 0px !important;
  65. width: 100% !important;
  66. max-width: 875px !important;
  67. left: 425px !important;
  68. // width: 100%
  69. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement