WordPress.org

Ready to get started?Download WordPress

Forums

Schemeable Sliding Panel
[resolved] Layering conflict (4 posts)

  1. dpeek
    Member
    Posted 1 year ago #

    But first off, very nice plugin. A well needed adaptation of WP Sliding Panel. Funny thing is I had just finished with my own manual adaptation of that plugin, but all the covenience interface features on this one definately make it worth the switch.

    However,... I'm having real trouble forcing it to play nice with a fixed menu I already have on my site. The entire Tab row at top prevents the main menu from being clickable. Take a look - http://dev.buildersinaugusta.com/

    I've tried crunching it in firebug, messing with overflow and z-index properties, but no dice. Any ideas?

    Keep up the great work!

    http://wordpress.org/extend/plugins/schemeable-sliding-panel/

  2. kdmurthy
    Member
    Plugin Author

    Posted 1 year ago #

    Glad that you liked it. Played around a bit and this seems to be working:

    #navbar {
      z-index: auto;
    }
    
    #navbar div.navbar div.navbar-inner {
      z-index: 10005 !important;
      width: 800px;
    }
    
    #sliding-panel .tab ul.login {
        clear: right;
        display: block;
        height: 42px;
        line-height: 42px;
        margin: 0;
        position: relative;
        text-align: center;
        width: auto;
        z-index: 10001;
    }

    Don't ask me why ;-)

    -- KD

  3. dpeek
    Member
    Posted 1 year ago #

    Thanks for the tip. I've inserted that css and it does allow the two fixed elements to finally co-exist, but now the main page content when scrolled up slides above and over the nav bar and not behind it.

    It's soo close to everything playing nice. Again I've been grappling with it in firebug, tried to set z-index of the navbar to a number, but yea only 'auto' will allow it to play nice with the other fixed one.

    Hoping you could work some final magic?

  4. kdmurthy
    Member
    Plugin Author

    Posted 1 year ago #

    Tried another approach. Check this out.

    #sliding-panel {
     background: black;
    }
    
    #navbar {
      min-width: 560px;
      width: 560px;
      z-index: 10001;} 
    
    #navbar .navbar-inner {
      background: url(http://dev.buildersinaugusta.com/wp-content/uploads/sliding-panel-schemes/images/tab_b-272727-999999.png) repeat-x 0 -1px;
    }

    The only problem I see is that the navbar is aligned to the left. Some padding/margin can be used to align it properly.

    -- KD

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.