xhtml css - obrazky

tominokk

potrebujem pomoct pri efekte vysunuti obrazkov, chcem aby vysunute- velke okno sa nacitalo vedla maleho a nie iba hore, skopirujem aj kod ak bude treba

aké okno preboha? ako a kam sa majú vysúvať aké obrázky? šak z tohto ani ty nemôžeš vedieť čo chceš

Tiež som to nepochopil. Pomohli by nejaké obrázky s popisom.

tominokk

no proste aby nebol ten obrazok na pevno hore co chcem zobrazit ale aby bol vedla maleho

<!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=windows-1250" />
<title>Zvětšení fotografií</title>

<style type="text/css">
@import"layout3.css";
#obal{background-image:url(nature-sunsetblissii-obrazky1600x1200.jpg)}
img.maly {border:0px;} /* Žadný rámeček okolo náhledů fotek v levém sloupci. */
div#minifotky a:hover {background:white} /* Toto je třeba provést, aby vše správně fungovalo i v prohlížeči IE6. Popravdě, nejsem si jistá proč tomu tak je. */
div#minifotky a img.velky {height: 0; width: 0; border-width: 0} /* Skrývá velkou fotku, tím, že mu přidělí výšku i šířku hodnotou 0. */
div#minifotky a:hover img.velky {position: absolute; top: 102px; left: 335px; height: 300px; width: 527px; border: none} /* Nechá velkou fotku zobrazit se na stejném místě jako „rám“ vpravo, když uživatel ukáže kurzorem myši na obrázek v levém sloupci. */
#ram {position: relative; top: 100px;left: 333px; height: 280px; width: 507px; border: 2px solid black; font: 1em "Trebuchet MS", Verdana, sans-serif; color: grey; padding: 10px} /* Vytváří prázdný „rám“, kde uživatel učekává zobrazení velké fotografie. */
p {margin-bottom:26px} /* Přiděluje spodní vnější okraj elementům p, takže se zarovnají s rámem, jenž zobrazuje velkou fotku. */
</style>
</head>
<div id="obal">
<div id="obsah">
<div id="hlavicka">
<h1>obrazky a vtipky</h1>
<p id="nav-tlacitka">
<a href="infinity.html">domov</a> •
<a href="">faq</a> •
<a href="">zdroje</a>
</p>

<div id="minifotky">

<p><a class="fotka" title="Loď nad kamenech" href="">
<img class="maly" src="skoda1.jpg" width="100" height="75" alt="superb" />
<img class="velky" src="skoda1.jpg" width="100" height="75" alt="Loď nda kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda2.jpg" width="100" height="75" alt="suberb" />
<img class="velky" src="skoda2.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda3.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda3.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda4.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda4.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď nad kamenech" href="">
<img class="maly" src="skoda1.jpg" width="100" height="75" alt="superb" />
<img class="velky" src="skoda1.jpg" width="100" height="75" alt="Loď nda kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda2.jpg" width="100" height="75" alt="suberb" />
<img class="velky" src="skoda2.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda3.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda3.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda4.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda4.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď nad kamenech" href="">
<img class="maly" src="skoda1.jpg" width="100" height="75" alt="superb" />
<img class="velky" src="skoda1.jpg" width="100" height="75" alt="Loď nda kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda2.jpg" width="100" height="75" alt="suberb" />
<img class="velky" src="skoda2.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda3.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda3.jpg" width="100" height="75" alt="Loď na kamenech" /></p>

<p><a class="fotka" title="Loď na kamenech" href="">
<img class="maly" src="skoda4.jpg" width="100" height="75" alt="skoda fabia kombi" />
<img class="velky" src="skoda4.jpg" width="100" height="75" alt="Loď na kamenech" /></p>
</div>
</div>
</div>
</div>
</body>
</html>

tominokk

v podstate som na to prisiel v img. velky trebalo zmenit hodnotu absolute na fixed, ide to len vo FF v opere to trosku seka a v IE to blbne:(