HighDots Forums  

Navigation Bar: Dreamweaver MX

Macromedia Dreamweaver Macromedia Dreamweaver Discussions (macromedia.dreamweaver)


Discuss Navigation Bar: Dreamweaver MX in the Macromedia Dreamweaver forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
DuLaus
 
Posts: n/a

Default Navigation Bar: Dreamweaver MX - 11-09-2004 , 11:19 AM






Hi, I created a navigation bar using the Dreamweaver wizard and with several
(image_on, image_off) .gif files etc. I only wanted the image_off state to be
on the target page (link). When I click my button image (image_on) using the
index.cfm file, the linked file which is abc.cfm should have this button in the
'off state'. Can someone clue me in to what I did wrong, as the abc.cfm file
is showing (image_on.gif). I do not want mouseover effects, just a simple color
change when on the respective template. Thanks


Reply With Quote
  #2  
Old   
Murray *TMM*
 
Posts: n/a

Default Re: Navigation Bar: Dreamweaver MX - 11-09-2004 , 11:26 AM






This will only happen on framed sites. Macromedia should have removed that
feature two releases ago.

Just use simple image swaps for your navigation, and set the down image with
javascript or CSS.

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"DuLaus" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:
Hi, I created a navigation bar using the Dreamweaver wizard and with
several
(image_on, image_off) .gif files etc. I only wanted the image_off state
to be
on the target page (link). When I click my button image (image_on) using
the
index.cfm file, the linked file which is abc.cfm should have this button
in the
'off state'. Can someone clue me in to what I did wrong, as the abc.cfm
file
is showing (image_on.gif). I do not want mouseover effects, just a simple
color
change when on the respective template. Thanks




Reply With Quote
  #3  
Old   
DuLaus
 
Posts: n/a

Default Re: Navigation Bar: Dreamweaver MX - 11-09-2004 , 12:11 PM



Thanks Murray,

So what your suggesting is use DreamweaverMX and create a rollover effect ,then find a Javascript for the down state.

Cheers

Reply With Quote
  #4  
Old   
DuLaus
 
Posts: n/a

Default Re: Navigation Bar: Dreamweaver MX - 11-09-2004 , 03:02 PM



Hi

Can anyone point me to an example for 'set the down image with
javascript or CSS'.

Thanks

Reply With Quote
  #5  
Old   
Murray *TMM*
 
Posts: n/a

Default Re: Navigation Bar: Dreamweaver MX - 11-09-2004 , 03:47 PM



Here's how to do it with javascript -

Put this in script tags in the head of the document -

function P7_downImage() {
var g7="<imagename>"
var g7url="<pathname>"
if ((g7=MM_findObj(g7obj))!=null) {g7.src=g7url;}
}

and this on the <body> tag

onload="P7_downImage()"

Then on each page you would need to make two edits:

Set g7 to the *name* of the button (not the file name but the HTML name -
e.g., "productsbutt"), and g7url to the pathname to the button (e.g.,
"images/nav/button3.gif"), and bada bing, bada boom!

Alternatively, if you are doing CSS rollovers (i.e., the images are the
background image of pseudo-class definitions), you can just make sure that
each menu button has a unique id, e.g.,

<a href="c_french.asp" id="button4">French Oak</a><a href="c_european.asp"
id="button5">European Oak</a>

and then use a stylesheet in the head like this -

<style type="text/css">
<!--
#button0 {
color: #F5D1B1;
background-color: #999999;
background-image:url(images/buttondown.gif);
}
-->
</style>

where the button number would just be edited to throw that particular button
'down'. This method also works very nicely with text only CSS rollovers
too....

You can see this latter method here -

http://www.oakfurnituremaker.co.uk/test/

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================

"DuLaus" <webforumsuser (AT) macromedia (DOT) com> wrote

Quote:
Hi

Can anyone point me to an example for 'set the down image with
javascript or CSS'.

Thanks



Reply With Quote
  #6  
Old   
DuLaus
 
Posts: n/a

Default Re: Navigation Bar: Dreamweaver MX - 11-11-2004 , 11:54 AM



Hi Murray I agree on the 'friggin mess' on these webforums. The upload file
utitily was very handy, and it is gone. You would think that someone would
write a script preventing these tables to go a mile wide?. In any case the
commented out body tag is a typo. I found a script very similar on
www.projectseven.com but it does nothing either. I have no errors but no
funtionality. I did the image swap with dreamweaver and did everything
according to instructions, so I am at a loss to explain. I have other JS
scripts running so maybe this is a problem ?. Thanks. <script
language=JavaScript> <!-- function openWindow(url,top,left,width,height){
popupWin = window.open(url, 'remote', 'scrollbars=no,resizable=no,top=' + top +
',left=' + left + ',width=' + width + ',height=' + height); } function
loadCountry(s) { var optValue = s.options[s.selectedIndex].value; if(optValue
!= '-1') window.location.href = optValue; } function AirFormVal() { if(
document.Form1.airlineReservation_flightPlan_1_dep artAirport.value == '' ||
document.Form1.airlineReservation_flightPlan_1_arr ivalAirport.value == '' ) {
location.href='http://www.reserveme.com/index.cfm?bfrn=74321'; return false;
} return true; } //--> </script> <link href='css/global.css' rel=stylesheet>
<!--- JAVASCRIPT IMAGE SWAP BELOW ---> <script language='JavaScript'
type='text/JavaScript'> <!-- function MM_preloadImages() { //v3.0 var
d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var
i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf('#')!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}} } function
MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr;
for(i=0;a&amp;&amp;i<a.length&amp;&amp;(x=a)&amp;& amp;x.oSrc;i++) x.src=x.oSrc;
} function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document;
if((p=n.indexOf('?'))>0&amp;&amp;parent.frames.len gth) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&amp;&amp;d.all) x=d.all[n]; for
(i=0;!x&amp;&amp;i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&amp;&amp;d.layers&amp;&amp;i<d.layers.l ength;i++)
x=MM_findObj(n,d.layers.document); if(!x &amp;&amp; d.getElementById)
x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var
i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array;
for(i=0;i<(a.length-2);i+=3) if
((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src;
x.src=a[i+2];} } //--> </script> <script language='JavaScript'
type='text/JavaScript'> <!-- //set the down image name for this page var
g7='hotel_off'; function P7_downImage(){ //v1.0 byPVII //set the down image
name convention var g,dd='_off'; if((g=MM_findObj(g7))!=null){gg=g.src;
tu=gg.lastIndexOf('.');
g.src=gg.substring(0,tu)+dd+gg.substring(tu,gg.len gth);} } //--> </script>
</head> <body bgcolor=#ffffff link=#333388 vlink=#333388 alink=#cc6600
leftmargin='0' topmargin='0' marginwidth='0' marginheight='0'
onLoad='P7_downImage();MM_preloadImages('images/buttons/flights_off.gif','images
/buttons/hotel_off.gif','images/buttons/car_off.gif','images/buttons/vacations_o
ff.gif','images/buttons/deals_off.gif','images/buttons/cruise_off.gif','images/b
uttons/themeparks_off.gif','images/buttons/destinations_off.gif','images/buttons
/golf_off.gif')'> <!--- LINK EG. ---> <a href='http://www.site.com'
onMouseOver='MM_swapImage('flights_on','','images/buttons/flights_off.gif',1)'
onMouseOut='MM_swapImgRestore()'><img src='images/buttons/flights_on.gif'
alt='' name='flights_on' width='56' height='15' border='0' onload=''></a>


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.