Solved

Dynamic Menu Tweak

Posted on 2006-07-19
7
219 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
IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 

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

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

Preface This is the third article about the EE Collaborative Login Project. A Better Website Login System (http://www.experts-exchange.com/A_2902.html) introduces the Login System and shows how to implement a login page. The EE Collaborative Logiā€¦
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

708 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

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now