Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5

Thread: Set visibility

  1. #1
    New Coder
    Join Date
    Nov 2009
    Posts
    62
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Set visibility

    I have this menu:
    PHP Code:
    <div class="nav">
            <
    div class="table">

                <
    ul class="select"><li><a href="#"><b>F</b></a></li></ul>

                <
    ul class="select"><li><a href="#"><b>D</b></a>
                    <
    div class="select_sub">
                        <
    ul class="sub">
                            <
    li><a href="#">K</a></li>
                            <
    li><a href="#">Ls</a></li>
                            <
    li><a href="#">Sz</a></li>
                        </
    ul>
                    </
    div>
                </
    li>
                </
    ul>

                <
    ul class="select"><li><a href="#"><b>Tr</b></a>
                    <
    div class="select_sub">
                        <
    ul class="sub">
                            <
    li><a ref="#" >Ú</a></li>
                            <
    li><a href="#">Bil</a></li>
                            <
    li><a href="#">K</a></li>
                            <
    li><a href="#">Cr</a></li>
                            <
    li><a href="#">L tudástár</a></li>
                        </
    ul>
                    </
    div>
                </
    li>
                </
    ul>


                <
    ul class="select"><li><a href="#"><b>Infotár</b></a>
                    <
    div class="select_sub">
                        <
    ul class="sub">
                            <
    li><a href="#"></a></li>
                            <
    li><a href="#">Sza</a></li>
                            <
    li><a href="#">Ke</a></li>
                            <
    li><a href="#">B</a></li>
                        </
    ul>
                    </
    div>
                </
    li>
                </
    ul>


                <
    ul class="select"><li><a href="#"><b>Elérhet&#337;ség</b></a>
                    
    <div class="select_sub">
                        <!--<
    ul class="sub">
                            <
    li><a href="#">Sample Menu 4</a></li>
                            <
    li><a href="#">Sample Menu 4</a></li>
                            <
    li><a href="#">Sample Menu 4</a></li>
                            <
    li><a href="#">Sample Menu 4</a></li>
                            <
    li><a href="#">Sample Menu 4</a></li>
                        </
    ul>-->
                    </
    div>
                </
    li>
                </
    ul>

            </
    div>
    </
    div
    the CSS is:
    PHP Code:
    .nav {
    height:35px
    backgroundurl(images2/bg.gifrepeat-x
    position:relative
    font-family:arialverdanasans-serif
    font-size:11px
    width:100%; 
    z-index:100;
    margin:0;
    padding:0;
    border-bottom:1px solid white;
    }

    .
    nav .table {
    display:table
    margin:0 auto;
    }

    .
    nav .select,
    .
    nav .current {
    margin:0
    padding:0
    list-
    style:none
    display:table-cell
    white-space:nowrap;
    }

    .
    nav li {
    margin:0
    padding:0
    height:auto
    float:left;
    }

    .
    nav .select a {
    display:block
    height:35px
    float:left
    font-weight:bold;
    backgroundurl(images2/bg.gif); 
    padding:0 30px 0 30px
    text-decoration:none
    line-height:35px
    white-space:nowrap
    color:#2b3238;
    }


    .
    nav .select a:hover
    .
    nav .select li:hover a {
    backgroundurl(images2/hover.gif); 
    padding:0 0 0 15px
    cursor:pointer
    color:#2b3238;
    }

    .
    nav .select a b{
        
    font-weight:bold;
        }

    .
    nav .select a:hover b
    .
    nav .select li:hover a b {
    display:block
    float:left
    padding:0 30px 0 15px
    background:url(images2/hover.gifright top
    cursor:pointer;
    }

    .
    nav .select_sub {
    display:none;
    }

    /* IE6 only */
    .nav table {
    border-collapse:collapse
    margin:-1px
    font-size:1em
    width:0
    height:0;
    position:relative;
    }

    .
    nav .sub {
    display:table
    margin:0 auto
    padding:0
    list-
    style:none;
    }

    .
    nav .sub_active .current_sub a
    .
    nav .sub_active a:hover {
    background:transparent
    color:#2b3238;
    }

    .
    nav .select :hover .select_sub
    .
    nav .current .show {
    display:block
    position:absolute
    width:100%; 
    top:35px
    background:url(images2/back.gif); 
    padding:0
    z-index:100
    left:0
    text-align:center;
    }

    .
    nav .current .show {
    z-index:10;
    }

    .
    nav .select :hover .sub li a
    .
    nav .current .show .sub li a {
    display:block
    float:left
    background:transparent
    padding:0 10px 0 10px
    margin:0
    white-space:nowrap
    border:0
    color:#2b3238;
    }

    .
    nav .current .sub li.sub_show a {
    color:#2b3238; 
    cursor:default; 
    }

    .
    nav .select .sub li a {
        
    font-weight:normal;
    }

    .
    nav .select :hover .sub li a:hover
    .
    nav .current .sub li a:hover {
    visibility:visible
    color:#73a0d2; 

    Works fine,except in IE6.i wrote some jquery to make it work in ie,but it doesn't work:
    PHP Code:
    <script type "text/javascript">
            $(
    document).ready(function(){
                $(
    "ul").hover(function(){
                    $(
    ".select_sub").css("visibility","visible");
                })
            })
        
    </script> 
    What is the problem?

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    The problem is, you're still mucking about with IE6. Isn't it time we ease out of IE6 and leave those people who can't seem to emerge from the fog behind?

    OK that's my smart *** answer... I apologize (though I do mean what I say)...

    In an earnest effort to adress your problem, I need to ask, how does it not work in IE6? And can you publish the page somewhere so we can see what it's doing or not doing? What doctype are you using?

    As an after-thought, it may be something as silly as changing <script type = "text/javascript"> to <script type="text/javascript"> (removing white space). Browsers are crazy flexible but sometimes they are surprisingly picky.

  • #3
    New Coder
    Join Date
    Nov 2009
    Posts
    62
    Thanks
    9
    Thanked 0 Times in 0 Posts
    I agree with you,ie6 is a pain in the *ss,but unfortunately i every day see people using that s**t.
    You can see a demo at http://www.valtaniakarok.hu/valtaniakarok/index10.php
    the horizontal menu,right below the header.
    Thx in advance.

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,678
    Thanks
    6
    Thanked 1,009 Times in 982 Posts
    In menu_style3.css on line 72 you set
    Code:
    .nav .select_sub {
    	display:none;
    }
    So, likewise, you have to reset it to display: block, not visiblity: visible.

  • #5
    New Coder
    Join Date
    Nov 2009
    Posts
    62
    Thanks
    9
    Thanked 0 Times in 0 Posts
    You were right,but if i change that to "display:block" then all the "subs" get messed up.
    I give up,i change that menu.
    Thank you for your help!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •