Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Sign In with Twitter Sign In with OpenID Sign In with Google

Sign In Sign Up

Categories

In this Discussion

Tagged

Jo Home Page
GitHub Repo
Welcome to the Jo support forums! Please Sign Up and join in the discussion. You can also Sign In instantly with Twitter, OpenID or your Google ID.
Position: Fixed DIV doesn't move with scroll
  • acidhaxacidhax January 2011
    Posts: 23

    I have a DIV with a position: fixed; css entry. However, using Jo -- this breaks, it just stays in that one spot, rather than moving with the scroll. This is how it's structured: this.scn = new joScreen( new joContainer([ new joFlexcol([ this.nav = new joNavbar(), this.stack = new joStackScroller() ]) ]).setStyle({position: "absolute", top: "0", left: "0", bottom: "0", right: "0"}) );

    var card = new joCard([ new joTitle('title'), new joHTML('< div id="leftnav" >< a href="#" > UPGRADE < a >< div >< div id="rightnav" >< a href="#" >HUNTING< a >< div >') ]);

    Does anybody know of a solution to this?

  • acidhaxacidhax January 2011
    Posts: 23

    I figured it out: I had to add the joHTML code with the DIV's to the joNavBar like this:

    this.nav = new joNavbar('< div id="leftnav" > < a href="#" >UPGRADE< /a >< /div >< div id="rightnav" >< a href="#" >HUNTING< /a >< /div >')

  • davedave January 2011
    Posts: 415

    Hmm while this should help you for now, this seems kind of awkward. joNavbar clearly needs some more flexibility in the future.

    Dave Balmer, Jo Code Wrangler
  • acidhaxacidhax January 2011
    Posts: 23

    Another solution was to add the joHTML object into the joContainer's joFlexcol. Ignoring the JoNav altogether. The Stack seems to break any fixed position css styles. So basically, add the joHTML containing the fixed DIV directly to the joContainer/joScreen as such:

    this.scn = new joScreen( new joContainer([ new joFlexcol([ new joHTML('< div id="leftnav" >< a href="#" >UPGRADE< /a >< /div >< div id="rightnav" >< a href="#" >HUNTING< /a >< /div >'), this.stack = new joStackScroller() ])]).setStyle({position: "absolute", top: "0", left: "0", bottom: "0", right: "0"}));

Add a Comment