Adobe CS4 Dreamweaver help. Simple problem?

Discussion in 'Mac Apps and Mac App Store' started by silvergts1998, Apr 5, 2009.

  1. silvergts1998 macrumors member

    Joined:
    Nov 11, 2008
    #1
    I just got this program and been messing with it. I don't do allot with web but just wanted to learn more about it just for myself.

    Here's the question:

    I used photoshop to slice my image file. I save it as a html and image file. I save the html part as the index.html. I open it in dreamweaver cs4 and center the sliced images. Now when I take an ap div tag file and put text in it, all looks fine. Now here's where I run into problems. When I resize the screen, the sliced image files centers fine but the ap div portion of it doesn't move with the slice images to stay in it's perspective spot.

    So how do I make it where the ap div layer stays in perspective to where I put it no matter what the screen resolution is?

    Any clues for a clueless person?



    Here's the code. Sorry it's long.




    <html>
    <head>
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>QW Template</title>
    <!-- TemplateEndEditable -->
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <script type="text/javascript">
    <!--
    function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
    }
    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_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[n];
    for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
    if(!x && 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>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <style type="text/css">
    <!--
    #apDiv1 {
    position:absolute;
    left:693px;
    top:386px;
    width:280px;
    height:197px;
    z-index:1;
    }
    body,td,th {
    color: #FFF;
    }
    -->
    </style>
    </head>
    <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/ON-NAV_04.jpg','images/ON-NAV_05.jpg','images/ON-NAV_06.jpg','images/ON-NAV_07.jpg','images/ON-NAV_08.jpg','images/ON-NAV_09.jpg')">
    <!-- Save for Web Slices (QW Template.psd) -->
    <div id="apDiv1">Test test!</div>
    <table width="850" height="1132" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
    <tr>
    <td colspan="8">
    <img src="images/Index_01.jpg" width="850" height="60" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_02.jpg" width="850" height="97" alt=""></td>
    </tr>
    <tr>
    <td>
    <img src="images/Index_03.jpg" width="302" height="17" alt=""></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Home','','images/ON-NAV_04.jpg',1)"><img src="images/Index_04.jpg" name="Home" width="65" height="17" border="0"></a></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('product','','images/ON-NAV_05.jpg',1)"><img src="images/Index_05.jpg" name="product" width="90" height="17" border="0"></a></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('order','','images/ON-NAV_06.jpg',1)"><img src="images/Index_06.jpg" name="order" width="73" height="17" border="0"></a></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('support','','images/ON-NAV_07.jpg',1)"><img src="images/Index_07.jpg" name="support" width="85" height="17" border="0"></a></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('contact us','','images/ON-NAV_08.jpg',1)"><img src="images/Index_08.jpg" name="contact us" width="114" height="17" border="0"></a></td>
    <td><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('customers','','images/ON-NAV_09.jpg',1)"><img src="images/Index_09.jpg" name="customers" width="106" height="17" border="0"></a></td>
    <td>
    <img src="images/Index_10.jpg" width="15" height="17" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_11.jpg" width="850" height="30" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_12.jpg" width="850" height="24" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_13.jpg" width="850" height="22" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_14.jpg" width="850" height="130" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_15.jpg" width="850" height="162" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_16.jpg" width="850" height="201" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_17.jpg" width="850" height="123" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_18.jpg" width="850" height="153" alt=""></td>
    </tr>
    <tr>
    <td colspan="8">
    <img src="images/Index_19.jpg" width="850" height="113" alt=""></td>
    </tr>
    </table>
    <!-- End Save for Web Slices -->
    </body>
    </html>
     
  2. deej999 macrumors regular

    Joined:
    Apr 1, 2009
    #2
    wow.. that's too much code for my eyes at this time :D

    Take a look at some tutorials to help you. I recommend these guys:
    http://designprovideo.com/tutorial/dreamweavercs4101

    You can watch the first 10% of the tutorial for free just by registering and you can watch their entire suite of video tutorials online (includes loads a PS, Flash, Lighroom, Illustrator... you get the idea!) free for the first month by subscribing... It is $25 a month after that I think..

    :apple:
     
  3. silvergts1998 thread starter macrumors member

    Joined:
    Nov 11, 2008
  4. Dolorian macrumors 65816

    Dolorian

    Joined:
    Apr 25, 2007
    #4
    What version of Photoshop are you using? When you save for web you should be able to place the slices within divs instead of tables and to generate CSS. Doing this will go a huge step forward on solving your problem and making your whole layout easier to manage.

    Other than that, without being able to look at the site itself, it is hard to offer any help. Can you upload it somewhere or make it a .zip and attach it to a post?
     

Share This Page