DominikSerafin/vuebar

jsfiddle demo request

diomed opened this issue · 1 comments

diomed commented

Hello

I'd really like to integrate vuebar into my page, but I'm having
real trouble figuring out how to do it.

So, I'd like to ask for a small demo, if you don't mind -demo that would basically
do what you did here: https://github.serafin.io/vuebar/
on full page, and replace whole official/usual right scrollbar with vuebar.
Of that I need demo if possible.

Thank you.

p.s. how come there are no official releases on github?

DominikSerafin commented

Hi @diomed

You can check source code of https://github.serafin.io/vuebar/

It's a little messy there to be honest, but to add Vuebar to whole page you need to set body overflow to hidden and wrap all content in another element.

Snippets taken from https://github.serafin.io/vuebar/:



body {
  margin: 0;
  overflow: hidden;
  padding: 0;
  background-color: #3079f4;
  -webkit-overflow-scrolling: touch;
}


...

// element that app is rendered in
#app {
  display: block;
  margin: 0 auto;
}

...

// el wrapping all the content
.el1full {
  display: block;
  width: auto;
  height: 100vh;
}  
 





<body>

  <div id="app" >

    <div class="el1full" v-bar>
      <div class="el2full" >

        ... page content
   
       </div>
     </div>

   </div> 

</body>
  • 👍1
  • 🎉1