Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Adobe Dreamweaver CS4 Mac---- Navigation bar with rollover stays vertical

Posted on 2010-11-21
9
678 Views
Last Modified: 2012-05-10
I am making a website for a class I am taking.
In Dreamweaver CS4 Mac:
I chose 'Insert --> Image Object --> Navigation Bar'
After entering in a few navigation bars and choosing the proper up/down/over/down while rollover images, it all shows up in a vertical stack. how do i get it to be in a horizontal stack? I see the option in the windows version of the program. see image below...  
for-EE.jpg
0
Comment
Question by:Justin_Edmands
  • 5
  • 4
9 Comments
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 34185663
Hi Justin_Edmands,

Your images are surrounded by <p> tags so that makes the line breaks.
0
 

Author Comment

by:Justin_Edmands
ID: 34189583
I don't see any <p> tags here. the only <p> on the screen is for my banner....which is not actually shown in the attached image (I left it out to avoid confusion)
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 34190278
Can you copy and paste the code for the images here, please?
0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 

Author Comment

by:Justin_Edmands
ID: 34190337
<script 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[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
  var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) {
      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr)
      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}
//-->
</script>
</HEAD>
<BODY bgColor=#006699 text=#000000 link=#000000 vLink=#ffffff aLink=#ffffff 
leftMargin=0 topMargin=0 marginwidth="0" marginheight="0" onLoad="MM_preloadImages('../../../Documents/IS343/techcorner/News_DOWN.jpg','../../../Documents/IS343/techcorner/News_ROLLOVER.jpg','../../../Documents/IS343/techcorner/News_ROLLOVER_WHILE_DOWN.jpg','../../../Documents/IS343/techcorner/Blog_DOWN.jpg','../../../Documents/IS343/techcorner/Blog_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Blog_ROLLOVER_WHILE_DOWN.jpg','../../../Documents/IS343/techcorner/Galleries_DOWN.jpg','../../../Documents/IS343/techcorner/Galleries_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Galleries_ROLLOVER_WHILE_DOWN.jpg','../../../Documents/IS343/techcorner/Reviews_DOWN.jpg','../../../Documents/IS343/techcorner/Reviews_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Reviews_ROLLOVER_WHILE_DOWN.jpg','../../../Documents/IS343/techcorner/Lawsuits_DOWN.jpg','../../../Documents/IS343/techcorner/Lawsuits_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Lawsuits_ROLLOVER_WHILE_DOWN.jpg')">
<style>
BODY {SCROLLBAR-FACE-COLOR: #006699; SCROLLBAR-HIGHLIGHT-COLOR: #006699; SCROLLBAR-SHADOW-COLOR: #999999; SCROLLBAR-3DLIGHT-COLOR: #FFFFFF; SCROLLBAR-ARROW-COLOR:  #CCFFFF; SCROLLBAR-TRACK-COLOR: #E3E3E3; SCROLLBAR-DARKSHADOW-COLOR: #666666; }
</style>
<TABLE borderColor=#000000 height=141 cellSpacing=0 cellPadding=0 width=800 
align=center border=2>
  <TR> 
    <TD vAlign=top align=left bgColor=#006699 height=141><p><img src="http://i43.photobucket.com/albums/e352/shockwavecs/theTechCorner_Banner_wide.jpg" width="800" height="141" border="0"></p>
      <table border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td><a href="../../../Documents/IS343/techcorner/techcorner_homepage.html" target="_top" onClick="MM_nbGroup('down','group1','NewsButton','../../../Documents/IS343/techcorner/News_DOWN.jpg',1)" onMouseOver="MM_nbGroup('over','NewsButton','../../../Documents/IS343/techcorner/News_ROLLOVER.jpg','../../../Documents/IS343/techcorner/News_ROLLOVER_WHILE_DOWN.jpg',1)" onMouseOut="MM_nbGroup('out')"><img src="../../../Documents/IS343/techcorner/News_UP.jpg" alt="NEWS" name="NewsButton" border="0" onload=""></a></td>
        </tr>
        <tr>
          <td><a href="javascript:;" target="_top" onClick="MM_nbGroup('down','group1','LawsuitsButton','../../../Documents/IS343/techcorner/Lawsuits_DOWN.jpg',1)" onMouseOver="MM_nbGroup('over','LawsuitsButton','../../../Documents/IS343/techcorner/Lawsuits_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Lawsuits_ROLLOVER_WHILE_DOWN.jpg',1)" onMouseOut="MM_nbGroup('out')"><img name="LawsuitsButton" src="../../../Documents/IS343/techcorner/Lawsuits_UP.jpg" border="0" alt="Lawsuits" onLoad=""></a></td>
        </tr>
        <tr>
          <td><a href="javascript:;" target="_top" onClick="MM_nbGroup('down','group1','BlogButton','../../../Documents/IS343/techcorner/Blog_DOWN.jpg',1)" onMouseOver="MM_nbGroup('over','BlogButton','../../../Documents/IS343/techcorner/Blog_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Blog_ROLLOVER_WHILE_DOWN.jpg',1)" onMouseOut="MM_nbGroup('out')"><img name="BlogButton" src="../../../Documents/IS343/techcorner/Blog_UP.jpg" border="0" alt="Blog" onLoad=""></a></td>
        </tr>
        <tr>
          <td><a href="javascript:;" target="_top" onClick="MM_nbGroup('down','group1','GalleriesButton','../../../Documents/IS343/techcorner/Galleries_DOWN.jpg',1)" onMouseOver="MM_nbGroup('over','GalleriesButton','../../../Documents/IS343/techcorner/Galleries_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Galleries_ROLLOVER_WHILE_DOWN.jpg',1)" onMouseOut="MM_nbGroup('out')"><img name="GalleriesButton" src="../../../Documents/IS343/techcorner/Galleries_UP.jpg" border="0" alt="Galleries" onLoad=""></a></td>
        </tr>
        <tr>
          <td><a href="javascript:;" target="_top" onClick="MM_nbGroup('down','group1','ReviewsButton','../../../Documents/IS343/techcorner/Reviews_DOWN.jpg',1)" onMouseOver="MM_nbGroup('over','ReviewsButton','../../../Documents/IS343/techcorner/Reviews_ROLLOVER.jpg','../../../Documents/IS343/techcorner/Reviews_ROLLOVER_WHILE_DOWN.jpg',1)" onMouseOut="MM_nbGroup('out')"><img name="ReviewsButton" src="../../../Documents/IS343/techcorner/Reviews_UP.jpg" border="0" alt="Reviews" onLoad=""></a></td>
        </tr>
    </table></TD>
  </TR>
  <TR> 

Open in new window

0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 34190348
Images are inside of table rows.  Each row is, well, a row.  So, one image per row per the code above.
0
 

Author Comment

by:Justin_Edmands
ID: 34190463
i'm a little confused. and i am fairly new at this. does TR denote the table row? Is there any way you could just complete the portion of the code to get me on the right track? I think it's just stupid how the windows version of this has a "Horizontally" checkbox while in the insert nav bar dialog box.
0
 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 500 total points
ID: 34190642
>> does TR denote the table row

Yes.

A table looks like this:

<table>  //starts the table
   <tr> //starts a row
       <td></td> // puts a cell (column) in the row
   </tr> // closes the row
</table> // closes the table

So your code above has a table with 5 rows and 1 column and each row contains a rollover image.  What you might want to do is create a table with 5 columns and 1 row and then the images will be horizontal if you have one image per cell.

Something like this:

<table>
  <tr>
     <td>rollover image code 1</td>
     <td>rollover image code 2</td>
      etc. etc. etc.
  </tr>
</table>

Open in new window


>> Is there any way you could just complete the portion of the code to get me on the right track?

I could easily complete the code but you said this was a school assignment.  I'm prohibited by the EE terms of use from doing other's homework for them (and I typically don't like doing that anyway...would rather teach).  I can advise you and present general tutorials but I won't just do it for you.

>> I think it's just stupid how the windows version of this has a "Horizontally" checkbox while in the insert nav
>> bar dialog box.

Yeah.  You are also using a deprecated function to do this.  Most navigation is done with CSS controlling ordered or unordered lists in modern pages.  In DW, you can use Spry to get a wizard to make a horizontal or vertical nav bar with rollover effects but done completely with text.
0
 

Author Comment

by:Justin_Edmands
ID: 34190688
Awesome!

deleted the extra <tr> and </tr> pieces of code and it is in one row now. Thanks a lot!
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 34190745
And there you go!
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Spry missing in DWcc 6 323
Regular Expressions find/replace needed 10 145
Error pops up while using DWCSS 2015 11 165
Adobe Dreamwever CS5.5 - mage sites help needed. 1 130
I still run into .cgi files every now and then. In some instances, I actually prefer the simplicity of a .cgi script to other options. Since I use DreamWeaver extensively, what I needed was a way to open .cgi scripts in Dreamweaver. And I wanted to …
Adobe Dreamweaver CS5 is a WYSIWYG web page editor that has advanced HTML, CSS, and Javascript rendering functionality and is probably the most well-known HTML editor available. Much of Dreamweaver's appeal centers around the Design View interfac…
A short tutorial showing how to set up an email signature in Outlook on the Web (previously known as OWA). For free email signatures designs, visit https://www.mail-signatures.com/articles/signature-templates/?sts=6651 If you want to manage em…

829 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