Return to the default state of menu problem

**asimcan** · 07-08-2009, 11:47 AM

Hello Friends,

menu demo : http://www.oyunbulteni.com/menu/

link under the menu link to return to the long line into default. How can I solve this problem?

PHP Code:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>sample</title>

<script type="text/javascript">
<!--

function renkdegistir(id,fid,url) {
    
    if (!document.getElementById)
        return null; 
    document.getElementById('px5').className = id;
    document.getElementById('footer').className = fid;
    document.getElementById('px5').href=url;
    
}
//-->
</script>
<style type="text/css">
<!--
body,td,th {
    font-family: Arial, Helvetica, sans-serif;
}


#px5 ul { margin-left:50px; list-style:none; height:21px;}


#px5 ul li {
display:inline;  
font-family:Tahoma; 
font-size:11px; 
font-weight:bold;
height:21px;
float:left;
color:transparent;
border:none;
}

li a {text-decoration:none; color:white; border:none; font-size:11px;}

#l1 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#00b2ff; }
#l2 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:red; }
#l3 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:black;}
#l4 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#00bbcc; }
#l5 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#ff6600; }
#l6 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#bfff00; }
#l7 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#068050; }


.c1 { border-bottom:5px solid #00b2ff; 
background-color:transparent;}

.c2 { border-bottom:5px solid red; 
background-color:transparent;}

.c3 { border-bottom:5px solid black; 
background-color:transparent;}

.c4 { border-bottom:5px solid #00bbcc; 
background-color:transparent;}

.c5 { border-bottom:5px solid #ff6600; 
background-color:transparent;}

.c6 { border-bottom:5px solid #bfff00; 
background-color:transparent;}

.c7 { border-bottom:5px solid #068050; 
background-color:transparent;}

#px5 {height:21px; margin-top:79px;}
#main {width:100%;background-color:#fff; display:table-row;}
#content { margin:20px 0px; display:table-cell;}
#footer {height:30px; margin-top:5px; background-color:#fff;
/* background-image:url('../images/if.png'); */
}

.sol {width:25%; float:left;     }
.sol_ic {margin: 10px 10px 10px 10px;}
.sag {width:75%; float:left;}
.sag_ic {margin: 10px 10px 10px 10px;}

.f1 { border-top:5px solid #00b2ff; 
background-color:transparent;}

.f2 { border-top:5px solid red; 
background-color:transparent;}

.f3 { border-top:5px solid black; 
background-color:transparent;}

.f4 { border-top:5px solid #00bbcc; 
background-color:transparent;}

.f5 { border-top:5px solid #ff6600; 
background-color:transparent;}

.f6 { border-top:5px solid #bfff00; 
background-color:transparent;}

.f7 { border-top:5px solid #068050; 
background-color:transparent;}  
-->
</style></head>

<body>
<div id="px5" class="c1">
    <ul>
        <li id="l1">
            <a href="#1" onclick="javascript:renkdegistir('c1','f1','index.php')">
                <span>Ana Sayfa</span>
            </a>
        </li>
        <li id="l2">
            <a href="#2" onclick="javascript:renkdegistir('c2','f2','index.php')">
                <span>Menu 2</span>
            </a>
        </li>
        <li id="l3">
            <a href="#3" onclick="javascript:renkdegistir('c3','f3','index.php')">
                <span>Menu 3</span>
            </a>
        </li>
        <li id="l4">
            <a href="#4" onclick="javascript:renkdegistir('c4','f4','index.php')">
                <span>Menu 4</span>
            </a>
        </li>
        <li id="l5">
            <a href="#5" onclick="javascript:renkdegistir('c5','f5','index.php')">
                <span>Menu 5</span>
            </a>
        </li>
        <li id="l6">
            <a href="#6" onclick="javascript:renkdegistir('c6','f6','index.php?page=giris-yap')">
                <span>Giriş Yap</span>
            </a>
        </li>
        <li id="l7">
            <a href="#7" onclick="javascript:renkdegistir('c7','f7','index.php')">
                <span>Menu 7</span>
            </a>
        </li>
    </ul>
</div>  
<div id="content"></div>
<div id="footer" class="f1"></div>
</body>
</html>

**vwphillips** · 07-08-2009, 12:10 PM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>sample</title>

<script type="text/javascript">
<!--

var suan;

function yuklenirken(){
    suan=location.hash;
    csss=suan.split('#');
    if (csss.length>0){
        id='c'+csss[1];
        fid='f'+csss[1];
        document.getElementById('px5').className = id;
        document.getElementById('footer').className = fid;
    }
}


function renkdegistir(id,fid,url) {

    if (!document.getElementById)
        return null;
    document.getElementById('px5').className = id;
    document.getElementById('footer').className = fid;
    document.getElementById('px5').href=url;

}
//-->
</script>
<style type="text/css">
<!--
body,td,th {
    font-family: Arial, Helvetica, sans-serif;
}


#px5 ul { margin-left:50px; list-style:none; height:21px;}


#px5 ul li {
display:inline;
font-family:Tahoma;
font-size:11px;
font-weight:bold;
height:21px;
float:left;
color:transparent;
border:none;
}

li a {text-decoration:none; color:white; border:none; font-size:11px;}

#l1 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#00b2ff; }
#l2 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:red; }
#l3 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:black;}
#l4 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#00bbcc; }
#l5 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#ff6600; }
#l6 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#bfff00; }
#l7 a span{ padding:4px 30px; float:left; margin:0px 0px 0px 1px; background-color:#068050; }


.c1 { border-bottom:5px solid #00b2ff;
background-color:transparent;}

.c2 { border-bottom:5px solid red;
background-color:transparent;}

.c3 { border-bottom:5px solid black;
background-color:transparent;}

.c4 { border-bottom:5px solid #00bbcc;
background-color:transparent;}

.c5 { border-bottom:5px solid #ff6600;
background-color:transparent;}

.c6 { border-bottom:5px solid #bfff00;
background-color:transparent;}

.c7 { border-bottom:5px solid #068050;
background-color:transparent;}

#px5 {height:21px; margin-top:79px;}
#main {width:100%;background-color:#fff; display:table-row;}
#content { margin:20px 0px; display:table-cell;}
#footer {height:30px; margin-top:5px; background-color:#fff;
/* background-image:url('../images/if.png'); */
}

.sol {width:25%; float:left;     }
.sol_ic {margin: 10px 10px 10px 10px;}
.sag {width:75%; float:left;}
.sag_ic {margin: 10px 10px 10px 10px;}

.f1 { border-top:5px solid #00b2ff;
background-color:transparent;}

.f2 { border-top:5px solid red;
background-color:transparent;}

.f3 { border-top:5px solid black;
background-color:transparent;}

.f4 { border-top:5px solid #00bbcc;
background-color:transparent;}

.f5 { border-top:5px solid #ff6600;
background-color:transparent;}

.f6 { border-top:5px solid #bfff00;
background-color:transparent;}

.f7 { border-top:5px solid #068050;
background-color:transparent;}
-->
</style></head>

<body>
<div id="px5" class="c1">
    <ul>
        <li id="l1">
            <a href="#1" onclick="javascript:renkdegistir('c1','f1','index.php')">
                <span>Ana Sayfa</span>
            </a>
        </li>
        <li id="l2">
            <a href="#2" onclick="javascript:renkdegistir('c2','f2','index.php')">
                <span>Menu 2</span>
            </a>
        </li>
        <li id="l3">
            <a href="#3" onclick="javascript:renkdegistir('c3','f3','index.php')">
                <span>Menu 3</span>
            </a>
        </li>
        <li id="l4">
            <a href="#4" onclick="javascript:renkdegistir('c4','f4','index.php')">
                <span>Menu 4</span>
            </a>
        </li>
        <li id="l5">
            <a href="#5" onclick="javascript:renkdegistir('c5','f5','index.php')">
                <span>Menu 5</span>
            </a>
        </li>
        <li id="l6">
            <a href="#6" onclick="javascript:renkdegistir('c6','f6','index.php?page=giris-yap')">
                <span>Giriş Yap</span>
            </a>
        </li>
        <li id="l7">
            <a href="#7" onclick="javascript:renkdegistir('c7','f7','index.php')">
                <span>Menu 7</span>
            </a>
        </li>
    </ul>
</div>
<div id="content1"></div>
            <a href="javascript:renkdegistir('c1','f1','index.php')" >
                Link
            </a>
<div id="footer" class="f1"></div>
</body>
</html>

**asimcan** · 07-08-2009, 12:15 PM

Can you explain how you're doing a fix, please.

Thread: Return to the default state of menu problem

Thread Tools

Search Thread

Return to the default state of menu problem

Bookmarks

Bookmarks

Posting Permissions