• Ever thought it'd be cool to have your art, writing, or challenge runs featured on PokéCommunity? Click here for info - we'd love to spotlight your work!
  • Dawn, Gloria, Juliana, or Summer - which Pokémon protagonist is your favorite? Let us know by voting in our poll!
  • Welcome to PokéCommunity! Register now and join one of the best fan communities on the 'net to talk Pokémon and more! We are not affiliated with The Pokémon Company or Nintendo.
    Register

Does...

Imakuni?

    • 3,546
    Posts
    21
    Years
    Does anyone know how i can add a menu like the menu on the left side of ppn?
    i wanna spice up my layout.
     
    Try google.com and searching "Drop down menus". I often have wondered how he did that. I could figure it out but i don't.... Wait.. grr ok i will take a look for you *runs off to code something*... BRB
     
    Roll-out might be a better search term...

    Take a look at PPN's source code perhaps?
     
    JKaizer said:
    Roll-out might be a better search term...

    Take a look at PPN's source code perhaps?
    Click to expand...
    Yeah..

    Right click and view source.. And if your Still confused download:
    Dreamweaver or Microsoft Frontpage.. Then edit it into your layout ^_^
     
    ok i got the code. im gonna recode my layout THaNKELS
     
    Be careful though, if Steve wrote the code himself then you don't have the right to use it without permission. (I learnt that stuff the hard way XD)
     
    im not using his code or pics. im recoding it my self. i just studied that code and used some code that i found on google.com
     
    OK, that's fine then. There are several similar scripts on script repositories too, if I recall correctly.
     
    this is a remix of two scripts
     
    OK, I hope it works out OK for you ^^
     
    yeah. my finished layout is almost done
     
    OK! I'll check it out when it's done. I hope you fixed the colours...
     
    Errr, you got a preview we could see?

    And would you be willing to share the code?
     
    well... :/ the code doesnt work... i messed it up...
    Code: 
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"[url="https://www.w3.org/TR/html4/loose.dtd"]https://www.w3.org/TR/html4/loose.dtd[/url]">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<DIV id=masterdiv>
	 <TABLE height="100%" cellSpacing=0 cellPadding=0 width=144 summary="">
		<TBODY>
		<TR>
		 <TD width="142" vAlign=top><DIV class=menutitle onclick="SwitchMenu('sub3')"></DIV>
			<DIV><SPAN class=submenu id=sub5> </DIV>
<DIV id=bottom>
<div align="left">		 
	 <TABLE id=bottom_table cellSpacing=0 cellPadding=3 width=813 align=center 
border=0>
		<TBODY>
		 <TR>
			<TD width="116" align=left vAlign=bottom><DIV class=menutitle onclick="SwitchMenu('sub3')">?Site</DIV>
				<DIV><span class="submenu" id="sub3">>><a href="template.php"> Home </a><br>
>> <a href="<A href="mailto:[email protected]">Email">mailto:[email protected]">Email The Webbie</a><br>
>> <a href="template.php?id=staff">Staff</a> <br>
>> <a href="*link removed*" target="_blank">Staff Login</a> <br>
>> <a href="*link removed*" target="_blank">Network</a> <br>
>> <a href="*link removed*" target="_blank">Topsites</a><br>
				</span></DIV>
				<DIV></DIV>
				<DIV class=menutitle id="sub2" onclick="SwitchMenu('sub4')">?Games</DIV>
				<DIV></DIV>
				<DIV><span class="submenu" id="sub4"> >><a href="template.php?id=rs"> Ruby and Sapphire</a><br></DIV>
<DIV><span class="submenu" id="sub4"> >> <a href="template.php?id=rby">Red/Blue/Yellow</a><br></DIV>
<DIV><span class="submenu" id="sub4"> >> <a href="template.php?id=gsc">Gold Silver Crystal</a><br></DIV>
<DIV><span class="submenu" id="sub4"> >> <a href="temlpate.php?id=colloseum">Colloseum </a><br></DIV>
<DIV><span class="submenu" id="sub4"> >> <a href="index2.php?id=tcg">Tcg</a><a href="template.php?id=tcg"> 1 and 2 </a><br></DIV>
<DIV><span class="submenu" id="sub4"> >> <a href="template.php?id=stadium">Stadium 1&2</a> <br>
<DIV><span class="submenu" id="sub4"> >> <a href="template.php?id=box">Pokemon Box </a><br></DIV>
				 </span>
					<DIV class=menutitle onclick="SwitchMenu('sub5')"><span class="submenu" id="sub4">?Anime</span></DIV><br>
<DIV></DIV><br>
<DIV><span class="submenu" id="sub4"> >><a href="template.php?id=char">Character Guide</a><br>
			<TD width="685" align=left vAlign=bottom> </TD>
		 </TR>
		</TBODY>
	 </TABLE>
</div>
</DIV></BODY></HTML>

    heres the one i based it off of:
    Code: 
    [font=Arial]<head>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}

.submenu{
margin-bottom: 0.5em;
}
</style>

<script type="text/javascript">

/***********************************************
* Switch Menu script- by Martial B of [url]https://getElementById.com/[/url]
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit [url]https://www.dynamicdrive.com/[/url] for full source code
***********************************************/

if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}

function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}

</script>
</head>[/font]
[font=Arial][size=2][color=#000000]<body>
[/color][/size][/font][font=Arial][size=2][color=#000000]<!-- Keep all menus within masterdiv-->
<div id="masterdiv">

<div class="menutitle" onclick="SwitchMenu('sub1')">Site Menu</div>
<span class="submenu" id="sub1">
- <a href="new.htm">What's New</a><br>
- <a href="hot.htm">What's hot</a><br>
- <a href="revised.htm">Revised Scripts</a><br>
- <a href="morezone/">More Zone</a>
</span>

<div class="menutitle" onclick="SwitchMenu('sub2')">FAQ/Help</div>
<span class="submenu" id="sub2">
- <a href="notice.htm">Usage Terms</a><br>
- <a href="faqs.htm">DHTML FAQs</a><br>
- <a href="help.htm">Scripts FAQs</a>
</span>

<div class="menutitle" onclick="SwitchMenu('sub3')">Help Forum</div>
<span class="submenu" id="sub3">
- <a href="https://www.codingforums.com">Coding Forums</a><br>
</span>

<div class="menutitle" onclick="SwitchMenu('sub4')">Cool Links</div>
<span class="submenu" id="sub4">
- <a href="https://www.javascriptkit.com">JavaScript Kit</a><br>
- <a href="https://www.freewarejava.com">Freewarejava</a><br>
- <a href="https://www.cooltext.com">Cool Text</a><br>
- <a href="https://www.google.com">Google.com</a>
</span>

<img src="about.gif" onclick="SwitchMenu('sub6')"><br>
<span class="submenu" id="sub6">
- <a href="https://www.dynamicdrive.com/link.htm">Link to DD</a><br>
- <a href="https://www.dynamicdrive.com/recommendit/">Recommend Us</a><br>
- <a href="https://www.dynamicdrive.com/contact.htm">Email Us</a><br>
</span>

</div>[/color][/size][/font]

[font=Arial][size=2][color=#000000]</body>
</html>[/color][/size][/font]
     
    Last edited:
    Eh, I'll wait until you fix it, then I might use it. ;P
     
    Code: 
    <head>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
<script type="text/javascript">
/***********************************************
* Switch Menu script- by Martial B of [url="https://getElementById.com/"]https://getElementById.com/[/url]
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit [url="https://www.dynamicdrive.com/"]https://www.dynamicdrive.com/[/url] for full source code
***********************************************/
if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
</script>
</head>
<body>
<!-- Keep all menus within masterdiv-->
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')">
  <div align="left">»Site Menu</div>
</div>
<span class="submenu" id="sub1">
<a href="test.php">•Home</a><br>
<a href="test.php?id=dls">•Downloads</a><br>
<a href="*link removed*" target="_blank">•Staff Login</a><br>
<a href="test.php?id=linker">•Link to Us</a><br>
<a href="<A href="mailto:[email protected]">•Contact">mailto:[email protected]">•Contact Us </a><br>
<a href="*link removed*" target="_blank">•Network</a><br>
<a href="*link removed*" target="_blank">•Topsites</a><br>
<a href="[url="https://pokemontns.clicdev.com/f/index.php"]https://pokemontns.clicdev.com/f/index.php[/url]" target="_blank">•Forums </a></span>
<div class="menutitle" onclick="SwitchMenu('sub2')">
  <div align="left">»Anime</div>
</div>
<span class="submenu" id="sub2">
<a href="test.php?id=epiguide">•</a><a href="test.php?id=epiguide">Episode Guide</a> <br>
<a href="test.php?id=char">•Character Guide </a><br>
<a href="test.php?id=banned">•Banned Episodes</a><br>
<a href="test.php?id=air">•Airing Times</a></span>
<div class="menutitle" onclick="SwitchMenu('sub3')">
  <div align="left">»Games</div>
</div>
<span class="submenu" id="sub3"><a href="test.php?id=rs">•Ruby/Sapphire</a><br>
<a href="test.php?id=gsc">•Gold/Silver/<br>
Crystal</a><br>
<a href="test.php?id=rby">•Red/Blue/<br>
Yellow<br>
</a> <a href="test.php?id=sta">•Stadium 1&2 </a><br>
<a href="test.php?id=collo">•Colloseum</a><br>
<a href="test.php?id=tcg">•TCG 1&2 </a><br>
<a href="test.php?id=glist">•Games List</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub4')">
  <div align="left">»Fans</div>
</div>
<span class="submenu" id="sub4">
<a href="test.php?id=php">•Fan Art</a><br>
<a href="test.php?id=art">•My Art</a><br>
<a href="test.php?id=lamo">•Lame Emails<br>
</a><a href="test.php?id=fanmail">•Fan Mail </a><a href="test.php?id=lamo"></a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub5')">
  <div align="left">»Webmasters</div>
</div>
<span class="submenu" id="sub5"><a href="test.php?id=php">•Php Includes</a><br>
<a href="test.php?id=scripts">•Php Scripts </a><br>
<a href="test.php?id=free">• Web Resources </a><br>
<a href="[url="https://www.freesql.org"]https://www.freesql.org[/url]" target="_blank">•Free Sql<br>
Database </a><br>
<a href="test.php?id=redir">•Redirection</a><br>
</span>
</div>
</body>
</html>
    is the code i use
     
    Ahh thnx Imakuni?.. I could use that maybe another day or something ^^'' That will be a big help for people.
     
    Try replacing this:
    Code: 
    <DIV class=menutitle onclick="SwitchMenu('sub3')">
    with this:
    Code: 
    <DIV class="menutitle" onclick="SwitchMenu('sub3')">
    You forgot the quotes around menutitle.
     
    was that a hint of saracasm simone? ;)
     
    I don't think so...

    So does the recent script one work? oO;
     
    You must log in or register to reply here.
    Back
    Top