Showing the Selected Page on a Dreamweaver MenuRollovers built using Dreamweaver and Fireworks are widely used in a menu systems (fig 1). When the mouse moves over each button the image is swapped with a rollover image red -> green (fig 2). The logical place to include the menu is in a template. But then how can you change the button to indicate that the page has been selected (fig 3) ?
The Dreamweaver template must determine when to display the normal image and when to display the selected image. This can be done using a template parameter. In each page that uses the template parameter is set to a unique value, 1,2,3... A template expression conditionally formats each menu item depending on which page it is being applied to. Below is a sample HTML code showing how this looks. The @@ symbols identify the template expression. When the template is applied to Page1.htm, menuselect is set to 1, so the image src becomes "menu1_s.gif" - grey in the above example. When the template is applied to Page2.htm menuselect variable is not equal to 1 so the image src becomes "menu1.gif" - purple . Template<!-- TemplateParam name="menuselect" type="number" value="0" --> <a href="Page1.htm" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('menu1','','../Images/menu1_f2.gif',1)"> <img name="menu1" src="@ <img name="menu2" src="@
Page1.htm<!-- InstanceParam name="menuselect" type="number" value="1" --> Page2.htm<!-- InstanceParam name="menuselect" type="number" value="2" -->
|
Resources Articles Access Database
|
@(menuselect==1?'Images/menu1_s.gif':'Images/menu1.gif')@@" Manchester, Liverpool, Warrington, St Helens, Southport, Preston, Blackburn, Bolton, Blackpool, Lancaster, Skelmersdale, Runcorn