{"action":"created","issue":{"url":"https://api.github.com/repos/nolimits4web/Swiper/issues/1709","repository_url":"https://api.github.com/repos/nolimits4web/Swiper","labels_url":"https://api.github.com/repos/nolimits4web/Swiper/issues/1709/labels{/name}","comments_url":"https://api.github.com/repos/nolimits4web/Swiper/issues/1709/comments","events_url":"https://api.github.com/repos/nolimits4web/Swiper/issues/1709/events","html_url":"https://github.com/nolimits4web/Swiper/issues/1709","id":154279041,"number":1709,"title":"Embedding Swiper in another element","user":{"login":"ohenepee","id":15159487,"avatar_url":"https://avatars.githubusercontent.com/u/15159487?v=3","gravatar_id":"","url":"https://api.github.com/users/ohenepee","html_url":"https://github.com/ohenepee","followers_url":"https://api.github.com/users/ohenepee/followers","following_url":"https://api.github.com/users/ohenepee/following{/other_user}","gists_url":"https://api.github.com/users/ohenepee/gists{/gist_id}","starred_url":"https://api.github.com/users/ohenepee/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ohenepee/subscriptions","organizations_url":"https://api.github.com/users/ohenepee/orgs","repos_url":"https://api.github.com/users/ohenepee/repos","events_url":"https://api.github.com/users/ohenepee/events{/privacy}","received_events_url":"https://api.github.com/users/ohenepee/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2016-05-11T15:55:41Z","updated_at":"2016-05-13T11:29:33Z","closed_at":"2016-05-13T11:29:33Z","body":"I can't embed swiper in another element... my own `div` which has other elements inside\r\n\r\nAgain I can't put an element above Swiper in the body tag... Is Swiper supposed to take the whole viewport? Cos I wanted to create an heading, but it displaces the last slide (if the header's height is 30px, the last slide will have 30px of its viewable area hidden)\r\n\r\n```\r\n<body>\r\n  <div id=\"title\">\r\n    <div id=\"appTitle\" class=\"inline-items\">Some Title</div>\r\n    <button id=\"invokeMenu\" class=\"inline-items\">...</button>\r\n  </div>\r\n  \r\n  <!-- Swiper -->\r\n  <div class=\"swiper-container swiper-container-h\">\r\n      <div class=\"swiper-wrapper\">\r\n          <div class=\"swiper-slide\">\r\n              <div class=\"swiper-container swiper-container-v\">\r\n                  <div class=\"swiper-wrapper\">\r\n                      <div class=\"swiper-slide\">Vertical Slide 1</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 2</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 3</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 4</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 5</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 6</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 7</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 8</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 9</div>\r\n                      --- more here --\r\n                      <div class=\"swiper-slide\">Vertical Slide 20</div>\r\n                      <div class=\"swiper-slide\">Vertical Slide 21</div>\r\n                  </div>\r\n              </div>\r\n          </div>\r\n          <div class=\"swiper-slide\">Horizontal Slide 2</div>\r\n      </div>\r\n      <!-- Add Pagination -->\r\n      <div class=\"swiper-pagination swiper-pagination-h\"></div>\r\n  </div>\r\n</body>\r\n\r\n   var swiperV = new Swiper('.swiper-container-v', {\r\n      slidesPerView: 4,\r\n      freeMode: true,\r\n      direction: 'vertical',\r\n      spaceBetween: 20,\r\n      observer: true,\r\n      freeModeMomentumRatio: 3,\r\n      freeModeMomentumBounceRatio: 3\r\n    });\r\n```"},"comment":{"url":"https://api.github.com/repos/nolimits4web/Swiper/issues/comments/219018431","html_url":"https://github.com/nolimits4web/Swiper/issues/1709#issuecomment-219018431","issue_url":"https://api.github.com/repos/nolimits4web/Swiper/issues/1709","id":219018431,"user":{"login":"nolimits4web","id":999588,"avatar_url":"https://avatars.githubusercontent.com/u/999588?v=3","gravatar_id":"","url":"https://api.github.com/users/nolimits4web","html_url":"https://github.com/nolimits4web","followers_url":"https://api.github.com/users/nolimits4web/followers","following_url":"https://api.github.com/users/nolimits4web/following{/other_user}","gists_url":"https://api.github.com/users/nolimits4web/gists{/gist_id}","starred_url":"https://api.github.com/users/nolimits4web/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nolimits4web/subscriptions","organizations_url":"https://api.github.com/users/nolimits4web/orgs","repos_url":"https://api.github.com/users/nolimits4web/repos","events_url":"https://api.github.com/users/nolimits4web/events{/privacy}","received_events_url":"https://api.github.com/users/nolimits4web/received_events","type":"User","site_admin":false},"created_at":"2016-05-13T11:29:33Z","updated_at":"2016-05-13T11:29:33Z","body":"Your question is about CSS basics, just make your title with absolute position and place it above the Swiper or make swiper with absolute position and put it behind the title"}}