Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Dynamic Menu Tweak

Posted on 2006-07-19
7
222 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
Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 

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

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

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

Shoutout to Emily Plummer (http://www.experts-exchange.com/members/eplummer26.html) for giving me this article! She did most of it, I just finished it up and posted it for her :)    Introduction In a previous article (http://www.experts-exchang…
What is Node.js? Node.js is a server side scripting language much like PHP or ASP but is used to implement the complete package of HTTP webserver and application framework. The difference is that Node.js’s execution engine is asynchronous and event…
Viewers will learn one way to get user input in Java. Introduce the Scanner object: Declare the variable that stores the user input: An example prompting the user for input: Methods you need to invoke in order to properly get  user input:
The viewer will learn how to count occurrences of each item in an array.

840 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