PDA

View Full Version : Image help.


DJel
07-04-2007, 01:26 AM
Hello,

I have a couple of quick questions about dreamweaver. The version I am using is CS3 and I'm a bit of a noob so I need some help. Here is a picture of what I have so far;

http://img260.imageshack.us/img260/7453/examplenu3.gif (http://imageshack.us)


What I want to do is to send the 'news' tab behind the 'About' tab so you can't see the golden line on the top of the 'news' tab. I also what to move the tab vertically so it lines up with the 'About' tab. Does Dreamweaver have layers like Photoshop? And do they work in the same way?

On a side note, can I code the drop down menu using javascript with images instead of just the normal rectangles?

Thanks for any help,

DJel.

edbr
07-04-2007, 03:45 AM
Not suer what you mean by behind the about tab.

yes layers are an important part of web design and you can use DW to make them.
yes you can apply to images look in behaviors

DJel
07-05-2007, 12:14 PM
The golden bar just above the news tab is on the news tab image rather than on the bottom of the About tab. Would I have to use a layer to bring the header above where the drop down menus will be? Also how would I move the news tab upwards? I have tried to set a value in the vheight part of the image properties but it will only move the image downwards.

edbr
07-06-2007, 03:05 AM
post your code

DJel
07-08-2007, 03:02 AM
OK, I've started again. I now have a different question. Is it possible to have the layers appear in the web browser exactly as they appear on the Dreamweaver design page?

This is what is happening at the moment.

Dreamweaver Window;
http://img294.imageshack.us/img294/5922/dreamweaverpr4.gif (http://imageshack.us)
Shot at 2007-07-07

Firefox Windows;
http://img225.imageshack.us/img225/5571/firefoxnd6.gif (http://imageshack.us)
Shot at 2007-07-07

And Code;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
left:77px;
top:23px;
width:900px;
height:157px;
z-index:1;
}
body {
text-align : center ;
min-width : 900px ;
}
div.wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}

}
body {
text-align : center ;
min-width : 900px ;
}
div.wrapper2 {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
#apDiv2 {
position:absolute;
left:240px;
top:222px;
width:108px;
height:28;
z-index:1;
}
-->
</style>
<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[i])&&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[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_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[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body>
<div id="apDiv2"><img src="Public_HTML/News-Off.gif" width="180" height="28" /></div>
<div id="wrapper"><img src="images/header1.gif" width="354" height="175" /><img src="images/logo.gif" width="193" height="175" /><img src="images/header2.gif" width="353" height="175" /></div>
<body onload="MM_preloadImages('images/Home-On.gif','images/About-On.gif','images/Faculties-On.gif','images/Community-On.gif','images/Contact_Us-On.gif')">
<div id="wrapper2"><a href="index.cfm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home','','images/Home-On.gif',1)"><img src="images/Home-Off.gif" alt="Home" name="Home" width="180" height="30" border="0" id="Home" /></a><a href="about.cfm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('About','','images/About-On.gif',1)"><img src="images/About_hkhs-Off.gif" alt="About " name="About" width="180" height="30" border="0" id="About" /></a><a href="faculties.cfm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Faculties','','images/Faculties-On.gif',1)"><img src="images/Faculties-Off.gif" alt="Faculties" name="Faculties" width="180" height="30" border="0" id="Faculties" /></a><a href="community.cfm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Community','','images/Community-On.gif',1)"><img src="images/Community-Off.gif" alt="Community" name="Community" width="180" height="30" border="0" id="Community" /></a><a href="contact_us.cfm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact Us','','images/Contact_Us-On.gif',1)"><img src="images/Contact_us-Off.gif" alt="Contact Us" name="Contact Us" width="180" height="30" border="0" id="Contact Us" /></a></div>

</body>
</html>
Sorry to ask these questions, I'm new to Dreamweaver...

kittyprrrs
07-21-2007, 08:53 PM
are you trying to do a rollover or a "onMouseOver" effect? if you are trying to do a rollover, under common, there is a Insert>image rollover....

if you are trying to do a mouse over effect, this might help you:

http://www.tutorialized.com/view/tutorial/Working-with-Layers/5282

Good luck.