/    Sign up×
Community /Pin to ProfileBookmark

Hey everyone!

I apologize in advance if this type of thread was already created in the past, but i am totally new to this forum so i decided to start from scratch.

Currently i am working on one of the website that had to be remade so i created an expandable menu on the left side of the page with bunch of submenus, which have links in them. On the right side i have a fuse column which gets updated each time the link is clicked. I wrote a cookie so that when user clicks on some header and then link even after page refresh that submenu block stays open.

What i am trying to accomplish now and i know for a fact it has to do with cookie…. i need to make sure that the link that user clicks on to update page on the rights gets highlighted and stays highlighted after a refresh. If user clicks on other link old link become with white background and new one is highlighted.

here i have my Javascript code, i am sorry i can’t give you full access to website that i am working on because you need special access to it, however, you still can get an idea.

If anyone could please tell me and fix my JS cookie code in order this highlighting would take place properly I would really appreciate it.

i am totally new to web design, therefore i get a lot of trouble with this. ?

thank you

Alina

[CODE]
<script type=”text/javascript”>
var persistmenu=”yes”
var persisttype=”sitewide”
if (document.getElementById){
document.write(‘<style type=”text/css”>n’)
document.write(‘.submenu{display: none;}n’)
document.write(‘</style>n’)
}
function cal() {
dt = new Date()
mo=dt.getMonth()+1
ts = “http://www.timeanddate.com/calendar/print.html?year=2003&typ=1&display=1&ol=0&space=0&country=1&cols=1&months=1&month=”+mo+”&moon=on&hol=on”
window.open(ts);
}
function calyr() {
dt=new Date()
yr = dt.getYear()
ts = “http://www.timeanddate.com/calendar/print.html?year=”+yr+”&typ=0&display=0&ol=0&space=0&country=1&cols=3&months=12&moon=on&hol=on”
window.open(ts);
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById(“masterdiv”).getElementsByTagName(“div”);
if(el.style.display != “block”){
for (var i=0; i<ar.length; i++){
if (ar[i].className==”submenu”){
ar[i].style.display = “none”;
}
}
el.style.display = “block”;
}
}
}

function get_cookie(Name){
var search = Name + “=”
var returnvalue = “”;
if (document.cookie.length > 0){
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(“;”, offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function onloadfunction(){
if (persistmenu==”yes”){
var cookiename=(persisttype==”sitewide”)? “switchmenu” : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!=””)
document.getElementById(cookievalue).style.display=”block”
}
}
function savemenustate(){
var inc=1, blockid=””
while (document.getElementById(“sub”+inc)){
if (document.getElementById(“sub”+inc).style.display==”block”){
blockid=”sub”+inc
break
}
inc++
}
var cookiename=(persisttype==”sitewide”)? “switchmenu” : window.location.pathname
var cookievalue=(persisttype==”sitewide”)? blockid+”;path=/” : blockid
document.cookie=cookiename+”=”+cookievalue
}

if (window.addEventListener)
window.addEventListener(“load”, onloadfunction, false)
else if (window.attachEvent)
window.attachEvent(“onload”, onloadfunction)
else if (document.getElementById)

window.onload=onloadfunction
if (persistmenu==”yes” && document.getElementById)
window.onunload=savemenustate
</script>[/CODE]

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@eidalina20authorAug 01.2006 — Sorry i didn't have enough room on previous page but this is the rest of my menu the actual CF and HTML part that i use.....

thank you

[CODE]<table cellpadding="0" cellspacing="0" width="100%">
<tr> <cfoutput>
<td class="bannerText"><div align="left"><img src="/outreach/images/left_corner.gif" border="0" align="absmiddle" />Training Menu</div></td></cfoutput></tr></table>
<div id="masterdiv">
<table width="100%">
<tr>
<td class="title"><b>Home:</b><a href="javascript: void(0);" onclick="sub1.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub1')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub1">
1.<a href="#lnk_path#fuse=home_welcome">Welcome</a><br>
2.<a href="#lnk_path#fuse=home_overview">Overview</a><br>
3.<a href="#lnk_path#fuse=home_mission">Mission</a><br>
4.<a href="#lnk_path#fuse=home_prerequisites">Prerequisites</a><br>
5.<a href="#lnk_path#fuse=courses">Computer Based Training</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><strong>Courses:</strong><a href="javascript: void(0);" onclick="sub2.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub2')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub2">
1.<a href="#lnk_path#fuse=course_overview">Overview</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Calendar:</b><a href="javascript: void(0);" onclick="sub3.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub3')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub3">
1.<a href="#lnk_path#fuse=course_calendar">Course Schedule</a><br>
2.<a href="javascript: void(0)" onclick='cal()'>Monthly Calendar</a><br>
3.<a href="javascript: void(0)" onclick='calyr()'>Annual Calendar</a><br>
4.<a href="http://www.timeanddate.com/calendar/" target="_blank">Holidays</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Enroll:</b><a href="javascript: void(0);" onclick="sub4.style.display='none';" style="text-decoration: none">&nbsp;[-]</a> <a href="javascript: void(0);" onclick="SwitchMenu('sub4')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub4">
1.<a href="#lnk_path#fuse=enrollment">Enrollment</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Facility:</b><a href="javascript: void(0);" onclick="sub5.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub5')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub5">
1.<a href="#lnk_path#fuse=location">Location</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>News:</b><a href="javascript: void(0);" onclick="sub6.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub6')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub6">
1.<a href="#lnk_path#fuse=training_news">Training News</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Resources:</b><a href="javascript: void(0);" onclick="sub7.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub7')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub7">
1.<a href="#lnk_path#fuse=knowledge_base">Knowledge base</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Students:</b><a href="javascript: void(0);" onclick="sub8.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub8')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub8">
1.<a href="#lnk_path#fuse=course_mat">Course materials</a>
</div>
</td>
</tr></table></cfoutput>
<table width="100%">
<tr>
<td class="title"><b>Help:</b><a href="javascript: void(0);" onclick="sub9.style.display='none';" style="text-decoration: none">&nbsp;[-]</a><a href="javascript: void(0);" onclick="SwitchMenu('sub9')" style="text-decoration: none">[+]</a></td></tr></table>
<cfoutput><table width="100%">
<cfset lnk_path = "#application.projectDir#/tools/training/web/test_index.cfm?">
<tr valign="top">
<td>
<div class="submenu" id="sub9">
1.<a href="mailto:[email protected]">Using this Site</a>
</div>
</td>
</tr></table></cfoutput>
</div>[/CODE]
×

Success!

Help @eidalina20 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...