[SOLVED] DHTML menu integration
Posted: Wed Jan 14, 2009 3:48 pm
Hello, I am currently trying to include a .js generated DHTML menu into my main template, I am using a program called DHTML Menu Builder. The program generates a couple of .js files that create the menu and their dropdowns, but when I add the scripts to my template code I get a series of smarty errors on the live site. I've looked into the smarty errors but am having no luck. I have also explored different approaches to the menu creation using the included menumanager and some modules (bMenu, TrueTypeText) but I am already comfortable with the DHTML program and am just wondering how I can use that along with CMSMS. My ultimate goal is to have an image-based navigation that also has drop downs. Below is my template code, and I'm sure it's something as easy as creating a new template for the .js scripts but I'm just not sure of the syntax and how to go about all of that. Thank you for any and all help!!
The site I am working on can be viewed at www.safaripetresort.com/build
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<__html>
<head>
<title>{sitename} - {title}</title>
{stylesheet}
{metadata}
</head>
</__body background="images/comp3bg.jpg" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- DHTML Menu Builder Loader Code START -->
<div id="dmbri" style="position:absolute;">
<img src="images/dmb_i.gif" name="dmbif" width="1" height="1" alt="">
<img src="dmb_m.gif" name="dmbjs" width="1" height="1" alt="">
</div>
<__script__ language="javascript" type="text/javascript">
var rimPath=null;var rjsPath=null;var rPath2Root=null;function InitRelCode(){var iImg;var jImg;var tObj;if(!document.layers){iImg=document.images['dmbif'];jImg=document.images['dmbjs'];tObj=jImg;}else{tObj=document.layers['dmbri'];if(tObj){iImg=tObj.document.images['dmbif'];jImg=tObj.document.images['dmbjs'];}}if(!tObj){window.setTimeout("InitRelCode()",700);return false;}rimPath=_gp(iImg.src);rjsPath=_gp(jImg.src);rPath2Root=rjsPath+"";return true;}function _purl(u){return xrep(xrep(u,"%%REP%%",rPath2Root),"\\","/");}function _fip(img){if(img.src.indexOf("%%REL%%")!=-1) img.src=rimPath+img.src.split("%%REL%%")[1];return img.src;}function _gp(p){return p.substr(0,p.lastIndexOf("/")+1);}function xrep(s,f,n){if(s) s=s.split(f).join(n);return s;}InitRelCode();
</__script>
<__script__ language="javascript" type="text/javascript">
function LoadMenus() {if(!rjsPath){window.setTimeout("LoadMenus()", 10);return false;}var navVer = navigator.appVersion;
if(navVer.substr(0,3) >= 4)
if((navigator.appName=="Netscape") && (parseInt(navigator.appVersion)==4)) {
document.write('<' + 'script language="javascript" type="text/javascript" src="' + rjsPath + 'nsmenu.js"><\/script\>');
} else {
document.write('<' + 'script language="javascript" type="text/javascript" src="' + rjsPath + 'iemenu.js"><\/script\>');
}return true;}LoadMenus();</__script>
<!-- DHTML Menu Builder Loader Code END -->
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="top"><table width="1120" border="0" cellspacing="0" cellpadding="0">
<tr align="left" valign="top">
<td><img src="images/1x1.jpg" width="39" height="15"></td>
<td><img src="images/1x2.jpg" width="96" height="15"></td>
<td><img src="images/1x3.jpg" width="409" height="15"></td>
<td><img src="images/1x4.jpg" width="57" height="15"></td>
<td><img src="images/1x5.jpg" width="414" height="15"></td>
<td><img src="images/1x6.jpg" width="105" height="15"></td>
</tr>
<tr align="left" valign="top">
<td><img src="images/2x1.jpg" width="39" height="29"></td>
<td colspan="4"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr align="left" valign="top">
<td><a href="http://www.safaripetresort.com/build/index.php"><img src="images/n1.jpg" width="59" height="29" border="0"></a></td>
<td><a onmouseover="cFrame.ShowMenu('Group002', 0, 0, false,'agiDMB_Group002|3',0);" onmouseout="cFrame.tHideAll();" href="#"><img name="agiDMB_Group002" src="images/n2.jpg" width="122" height="29" border="0"></a></td>
<td><a onmouseover="cFrame.ShowMenu('Group003', 0, 0, false,'agiDMB_Group003|3',0);" onmouseout="cFrame.tHideAll();" href="#"><img name="agiDMB_Group003" src="images/n3.jpg" width="256" height="29" border="0"></a></td>
<td><a onmouseover="cFrame.ShowMenu('Group004', 0, 0, false,'agiDMB_Group004|3',0);" onmouseout="cFrame.tHideAll();" href="#"><img name="agiDMB_Group004" src="images/n4.jpg" width="136" height="29" border="0"></a></td>
<td><a onmouseover="cFrame.ShowMenu('Group005', 0, 0, false,'agiDMB_Group005|3',0);" onmouseout="cFrame.tHideAll();" href="#"><img name="agiDMB_Group005" src="images/n5.jpg" width="138" height="29" border="0"></a></td>
<td><img src="images/n6.jpg" width="265" height="29"></td>
</tr>
</table></td>
<td><img src="images/2x6.jpg" width="105" height="29"></td>
</tr>
<tr align="left" valign="top">
<td><img src="images/3x1.jpg" width="39" height="262"></td>
<td><img src="images/3x2.jpg" width="96" height="262"></td>
<td><img src="images/3x3.jpg" width="409" height="262"></td>
<td><img src="images/3x4.jpg" width="57" height="262"></td>
<td><img src="images/3x5.jpg" width="414" height="262"></td>
<td><img src="images/3x6.jpg" width="105" height="262"></td>
</tr>
<tr align="left" valign="top">
<td><img src="images/4x1.jpg" width="39" height="439"></td>
<td><img src="images/4x2.jpg" width="96" height="439"></td>
<td><div>{content}</div></td>
<td><img src="images/4x4.jpg" width="57" height="439"></td>
<td background="images/4x5bg.jpg"> </td>
<td><img src="images/4x6.jpg" width="105" height="439"></td>
</tr>
<tr align="left" valign="top">
<td><img src="images/5x1.jpg" width="39" height="60"></td>
<td><img src="images/5x2.jpg" width="96" height="60"></td>
<td><img src="images/5x3.jpg" width="409" height="60"></td>
<td><img src="images/5x4.jpg" width="57" height="60"></td>
<td><img src="images/5x5.jpg" width="414" height="60"></td>
<td><img src="images/5x6.jpg" width="105" height="60"></td>
</tr>
</table></td>
</tr>
</table>
<__body>
</__html>