Vyjížděcí menu z Photoshopu

Dobrý večer, Udělala jsem si 3 menu ve Photoshopu a chtěla bych aby po přejetí myší přes tlačítko 1. menu vyjelo 2. menu a z dalšího tlačítka 3. menu. Pomocí Photoshopu jsem se vyhla mezerám, které si mi v menu dělaly v Exploreru, když jsem menu udělala CSS-nedokázala jsem je odstranit. Mohl by mi prosím někdo poradit, zda to vyjetí jde nějak nastavit v Photoshopu nebo ve Front Page? Teď stránky vypadají tak, že jdou vidět všechny menu http://spackovi.wz.cz/indexkk.htm

----
Zpětná editace Mistrem: Odkaz opraven do původní podoby. Když jsem se na odkaz díval včera, stránka se nenačetla, proto jsem se domníval, že se jedná o chybu (i s ohledem na neobvyklý - na první pohled - překlep v adrese).

Správně je to se dvěma k, adresa je http://spackovi.wz.cz/indexkk.htm mám tam těch testovacích stránek víc, tak jsem je takto odlišila. Samotnou indexovou stránku tam mám a z ní to odkazuje na ruzně označený indexka. Přesněji sem to dělala v Image Ready. Je to teda nesmysl, ten můj dotaz?

Má někdo zkušenosti s Imagine Ready, zda tam jde uděla vyjížděcí menu? Mohl by mi prosím někdo poradit, případně se kouknout na zdrojový kód stránek. Mám tam zbytek CSS z původního vyjížděcího menu, šlo by to nějak napasovat na ty menu z IR?

Já photoshop a Image Ready celkem ovládám, umím si tam udělat promačkávací menu přes rollovery viz. odkaz na stránky, ale neumím si propojit ty dvě menu aby jedno vyjelo z druhého, proto se mi tam objevují všechny, což je nesmysl. Už sem si zkoušela udělat vyjížděcí menu podle Intervalu (po tomoto menu mi zbyl na stránkách kus CSS kódu), ale nepodařilo se mi ho dostat do takové podoby, aby se zobrazovalo správně a stejně v IE a FF prohlížeči (v IE mi tam furt zůstávaly mezery). Proto se ptám zda by mi někdo neporadil jak mám teď postupovat, když mám menu vytvořené v IR. Prosím mějte se mnou trpělivost a poraďtě mi někdo... :o(

Dík Obine za radu, ale v CSS se dost plácám.

Třeba by pomohlo kdybych vám ukázala co se mi z IR vygenerovalo za java script a CSS, šlo by tam někde nastavit to vysouvání?

<script type="text/javascript">
<!--

userAgent = window.navigator.userAgent;
browserVers = parseInt(userAgent.charAt(userAgent.indexOf("/")+1),10);
function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function findElement(n,ly) {
if (browserVers < 4) return document[n];
var curDoc = ly ? ly.document : document;
var elem = curDoc[n];
if (!elem) {
for (var i=0;i<curDoc.layers.length;i++) {
elem = findElement(n,curDoc.layers[i]);
if (elem) return elem;
}
}
return elem;
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
var img;
for (var i=0; i<changeImages.arguments.length; i+=2) {
img = null;
if (document.layers) {
img = findElement(changeImages.arguments[i],0);
}
else {
img = document.images[changeImages.arguments[i]];
}
if (img) {
img.src = changeImages.arguments[i+1];
}
}
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
sedy_tl1_p = newImage("obrazy/sedy_tl1-p.gif");
sedy_tl2_p = newImage("obrazy/sedy_tl2-p.gif");
sedy_tl3_p = newImage("obrazy/sedy_tl3-p.gif");
sedy_tl4_p = newImage("obrazy/sedy_tl4-p.gif");
sedy_tl5_p = newImage("obrazy/sedy_tl5-p.gif");
sedy_tl6_p = newImage("obrazy/sedy_tl6-p.gif");
sedy_tl7_p = newImage("obrazy/sedy_tl7-p.gif");
sedy_tl8_p = newImage("obrazy/sedy_tl8-p.gif");
sedy_tl9_p = newImage("obrazy/sedy_tl9-p.gif");
preloadFlag = true;
}
}

// -->
</script>
<!-- End Preload Script -->
<!-- ImageReady Styles (sedydole.psd) -->
<style type="text/css">
<!--

#Table_01 {
position:absolute;
left:0px;
top:0px;
width:150px;
height:225px;
}

#sedy-tl1 {
position:absolute;
left:0px;
top:0px;
width:150px;
height:25px;
}

#sedy-tl2 {
position:absolute;
left:0px;
top:25px;
width:150px;
height:25px;
}

#sedy-tl3 {
position:absolute;
left:0px;
top:50px;
width:150px;
height:25px;
}

#sedy-tl4 {
position:absolute;
left:0px;
top:75px;
width:150px;
height:25px;
}

#sedy-tl5 {
position:absolute;
left:0px;
top:100px;
width:150px;
height:25px;
}

#sedy-tl6 {
position:absolute;
left:0px;
top:125px;
width:150px;
height:25px;
}

#sedy-tl7 {
position:absolute;
left:0px;
top:150px;
width:150px;
height:25px;
}

#sedy-tl8 {
position:absolute;
left:0px;
top:175px;
width:150px;
height:25px;
}

#sedy-tl9 {
position:absolute;
left:0px;
top:200px;
width:150px;
height:25px;
}

-->
</style>
<!-- End ImageReady Styles -->
</head>

Přišla jsem ještě jednou škemrat o radu, prosím prosím jak rozjet rozjížděcí menu vyrobené v IR? Moc bych potřebovala to spustit. Prosím prosím smutně koukám, poraďte.

jojoj
Díky moc :o) zachránil si mě. Vybrala jsem si jedno menu a už ho mám jakš takš upravené. Akorát nevím, kde mám nastavit šířku a výšku tlačítek, chtěla bych to na heigh 25 px a width 150px. Zkoušela sem to vrazit všude možně a nešlo mi to. Vím že sem otravná, ale moc tě prosím, kde to mám napsat?

<style>

* {margin: 0; padding: 0;}
body {margin: 0 50px; font: small/1.9 Verdana, Arial, lucida, helvetica, sans-serif; color: #333;}
* html body, * html td {font-size: x-small;}
p {margin-bottom: 0.2em; text-align: center; width: 540px;}
* html p {width: 440px;}
table {border-collapse: collapse; margin-top: -1px;}

/* Zakladne styly */

#menu {float: left; width: 120px;}
#menu ul {list-style-type: none;}
#menu li {float: left; position: relative; width: 120px;}
#menu li a {display: block; border-top: 1px solid #fff; border-right: 1px solid #fff; width: 150px; background: #c9c9a7; color: #000; font-weight: bold; line-height: 2em; text-decoration: none; text-align: left; padding: 0 .9em;}
* html #menu li a {width: 120px; position: relative; overflow: hidden;}
#menu li ul {position: absolute; display: none; width: 120px; top: 0; left: 120px;}
* html #menu li ul {display: block; margin-top: -1px;}

/* Hover efekty */

#menu li a:hover, #menu li:hover a {background: #b3ab79 url('dole.png'); color:#000; overflow: visible;}
#menu li:hover ul {display: block;}
#menu li li a, #menu li:hover li a {font-weight: normal; background: #c9c9a7 url('nahore2.png'); color: #000;}
#menu li li a:hover, #menu li:hover li a:hover {background: #b3ab79 url('dole2.png'); color:#000;}
</style>