Solved

Dynamic Menu Tweak

Posted on 2006-07-19
7
221 Views
Last Modified: 2010-04-06
The original code can be found here: http://www.experts-exchange.com/Web/Web_Languages/Q_21910499.html
This is NOT a pointer. Please post all responses in this thread.

I would like to change it to the following:
<!--Begin HeaderLink-->
     <div id="menuCP" class="mHL" onclick="toggleMenu('menuCPSub')">
          <span id="menuCPsign">+</span> Header
     </div>
<!--End Header-->

I want to change the sign using innerHTML( this way a variable could be set to equal a character or a string of text to represent an image if need be).  + or -. if the menu is open display "-" if it is closed display "+".

I could probably do this on my own after the wonderful job dragon did helping me, but unfortunatley time is not on my side, So I need the help of the experts here. I am thinking very little needs to be done.
0
Comment
Question by:cipiWeb
  • 4
7 Comments
 
LVL 30

Expert Comment

by:callrs
ID: 17159706
Run this innerHTML demo:

<html>
<script type="text/javascript">
setTimeout('document.getElementById("menuCPsign").innerHTML="-"',3000);
</script>
<div id="menuCPsign">
+
</div>
</html>
0
 

Author Comment

by:cipiWeb
ID: 17166995
Thank you Call.

it changed the inner html but it is not quite what I am looking for.
0
 

Author Comment

by:cipiWeb
ID: 17167608
I found the answer I was looking for on my own research and will ask that this thread be deleted. Thank you for your input.
0
NAS Cloud Backup Strategies

This article explains backup scenarios when using network storage. We review the so-called “3-2-1 strategy” and summarize the methods you can use to send NAS data to the cloud

 

Author Comment

by:cipiWeb
ID: 17169699
Thank you RomMod.

The solution I arrived at involved tweaking the toggle function code. I adopted a slightly different naming convention to accomadate this code. if you would like me to provide and explaination for that I would be happy to. The original code can be found on the link above.

Here is my solution:

//Original toggleMenu() Source: http://javascript.about.com/library/blclmenu.htm
//Many thanks to Dragonlaird(http://www.experts-exchange.com/M_991525.html) of the Experts Exchange.

function toggleMenu(objID) {  
  // Replaces our old function. Simply toggles the display style of an object on the page
  if (!document.getElementById) return;
 
  // Find object, store it in ob
  objSubID = objID + "Sub";
  var ob = document.getElementById(objSubID);
 
  //Find object containing the sign, store it in sign
  objSignID = objID + "Sign";
  var sign = document.getElementById(objSignID);
 
  if(ob) {
    // We found our object, check if it's currently visible or hidden
    if(ob.style.display == 'block') {
      // Close Menu, remove from Open Menu List
      ob.style.display = 'none';
      sign.innerHTML = "+"
      saveMenu(objID, false);
    }
    else
    {
      // Menu is currently closed, open it and add it to our list of opened menus
      ob.style.display = 'block';
      sign.innerHTML = "&ndash;" //
      saveMenu(objID, true);
    };
  };
};
0
 

Author Comment

by:cipiWeb
ID: 17201203
Callrs, do you have any objections?
0
 
LVL 1

Accepted Solution

by:
GhostMod earned 0 total points
ID: 17206041
Closed, 500 points refunded.

GhostMod
Community Support Moderator
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preface This article introduces an authentication and authorization system for a website.  It is understood by the author and the project contributors that there is no such thing as a "one size fits all" system.  That being said, there is a certa…
There are two main kinds of selectors in CSS: One is base selector like h1, h2, body, table or any existing HTML tags.  For instance, the following rule sets all paragraphs (<p> elements) to red: (CODE) CSS also allows us to define our own custom …
Viewers will learn about if statements in Java and their use The if statement: The condition required to create an if statement: Variations of if statements: An example using if statements:
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

832 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question