Přidej si svou IT školu do profilu a najdi spolužáky zde na síti :)
Avatar
Jakub Chán
Člen
Avatar
Jakub Chán:10.10.2016 8:52

Ahoj,
mám na stránce vlevo vysouvací vertikální menu. Je-li obsah stránky text, obrázek, tabulka ..... vysouvací menu se zobrazuje v pořádku (nad obsahem stránky). Je-li ovšem v obsahu .pdf (zkóušel jsem embed, iframe i object) vysouvací menu se schová za obsah stránky. Bohužel z-index v CSS na to nezabírá. Nějaké nápady? děkuji mockrát :-)

 
Odpovědět 10.10.2016 8:52
Avatar
Pavel Mareš
Redaktor
Avatar
Pavel Mareš:10.10.2016 14:18

nějaký odkaz na web. verzi?

Editováno 10.10.2016 14:19
Nahoru Odpovědět 10.10.2016 14:18
Grafik, Vývojář, Workoholik :)
Avatar
Jakub Chán
Člen
Avatar
Odpovídá na Pavel Mareš
Jakub Chán:10.10.2016 14:45

Ahoj, je to firemní intranet, kompletně offline. Slouží jen k centralizaci důležitých informací. Přidám kód, zda bude chtít někdo nahlédnout
:-)

 
Nahoru Odpovědět 10.10.2016 14:45
Avatar
Jakub Chán
Člen
Avatar
Jakub Chán:10.10.2016 14:50

<!DOCTYPE html>
<html lang="cs-cz">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EDGE"/>
<title>Intranet</ti­tle> <!--hlavicka v prohlizeci-->
<link rel="stylesheet" href="style.css" type="text/css" /> <!--propojeni se style sheetem-->
</head>

<body>
<table>
<tr>
<th colspan="2" class="namece­ll">INTRANET</th> <!--hlavicka-->
<th class="logoce­ll"><img class="logo" src="pictures/lo­go.png" alt="logo"></th>
</tr>
<tr class="podhla­vicka"> <!--podhlavicka-->
<td class="homece­ll"><img class="home" src="pictures/ho­me.png" alt="home"/></td>
<td class="homece­ll">TBD</td>
<td>DURA WEB</td>
</tr>
<tr>
<td class="menucell"> <!--menu bunka-->
<ul class='menu'>
<li style='width:200px'>KON­TAKT</li>
<li style='width:200px'>TE­LEFONNÍ SEZNAM STK</li>
<li style='width:200px'>IN­TERNET</li>

<li style='width:200px'>OD­KAZ2<span>></span>
<ul>
<li style='width:200px'>OD­KAZ2.1</li>
<li style='width:200px'>OD­KAZ2.2</li>
<li style='width:200px'>OD­KAZ2.3</li>
</ul>
</li>
<li style='width:200px'>OD­KAZ3<span>></span>
<ul>
<li style='width:200px'>OD­KAZ3.1</li>
<li style='width:200px'>OD­KAZ3.2</li>
<li style='width:200px'>OD­KAZ3.3</li>
</ul>
</ul>
</td>
<td class="obsah" colspan="2"> <!--obsah stranky-->
<article>
<header>
<h3>DURA Automotive</h3>
</header>
<section>
<h4>

</h4>
</section>
</article>
</td>
</tr>
<tr>
<td class="footer" colspan="3"> 2016 </td> <!--paticka-->
</tr>
</table>

</body>
</html>

Editováno 10.10.2016 14:50
 
Nahoru Odpovědět 10.10.2016 14:50
Avatar
Jakub Chán
Člen
Avatar
Jakub Chán:10.10.2016 14:52

CSS - týkající se menu

.menu li
{
position: relative;
}

.menu, .menu ul
{
padding: 0;
list-style-type: none;
margin-top: 0px;
}

.menu li
{
text-align: left;
/* padding: 0 2 0 10px;
height: 45px;
line-height: 30px;
background-color: #393939;
background-position: left top;
background-repeat: repeat-x;
display: block;
border-bottom: 1px;
border-top: 0px;
border-left: 0px;
border-right: 0px;
border-style: solid;
border-color: white;

line-height: 50px;
color: white;
font-family: 'Arial';
font-size: 18px;
font-weight: normal;
font-style: normal;
text-decoration: none;
padding-left: 10px;
z-index: 0;
}

.menu a
{
text-decoration: none;
color: white;
display: block;
}

.menu li {
cursor: pointer;
}

.menu li span {
right: 8px;
font-style: italic;
position: absolute;
}

.menu ul {
visibility: hidden;
left: 0;
top: 0;
position: absolute;
}

.menu li:hover
{
background-color: black;
background-position: 0 -30px;
color: #f80
}

.menu li:hover>ul
{
visibility: visible;
top: 0px;
left: 100%;
z-index: 100;
}

 
Nahoru Odpovědět 10.10.2016 14:52
Avatar
Ján Timoranský
Redaktor
Avatar
Odpovídá na Jakub Chán
Ján Timoranský:10.10.2016 15:00

Prosím ťa, že ma klame zrak a nemáš web robený cez tabuľku?? Sa ani nedivím, že ti to nejde, veď tabuľka je zlo, ktoré treba za splnu mesiaca zakopať presne 3 metre pod zem, 2 kroky na severových od 30 rokov starej vŕby za spevu lesních víl. Aspoň to hovorí legenda. Večer sa ti na to pozriem, nemaj strach ale tú tabuľku ti neodpustím...

Nahoru Odpovědět  +4 10.10.2016 15:00
Find what you love and let it kill you.
Avatar
David Moškoř:10.10.2016 15:03

Tohle by ti mohlo fungovat:

<style media="print">
.menu ul li
{
display:none;
}
</style>

Pochopil jsem to tak, že když se obsah tiskne v PDF, tak se to stane. Možná, že jsem to pochopil špatně nevím.

Akceptované řešení
+20 Zkušeností
+1 bodů
Řešení problému
Nahoru Odpovědět 10.10.2016 15:03
Všechno jde, když se chce!
Avatar
Jakub Chán
Člen
Avatar
Odpovídá na David Moškoř
Jakub Chán:10.10.2016 16:35

Děkuji Davide ;)
moc si vážím rady.

Btw - tohle je můj první projekt. Je to malý firemní intranet, sloužící pouze k centralizaci důležitých informací. Proto děkuji i Slovenskému příteli za podporu ;) ..... Zatím co jsi vymýšlel tuhle krásnou pohádku, David můj problém vyřešil ve čtyřech řádcích .... ještě jsem zapomněl zmínit, že problém přetrvával jen v IE. Nakonec se mi s Davidovou pomocí podařilo docílit můj záměr. ještě jednou díky ;-)

 
Nahoru Odpovědět 10.10.2016 16:35
Avatar
Ján Timoranský
Redaktor
Avatar
Odpovídá na Jakub Chán
Ján Timoranský:10.10.2016 16:49

Som rád, že som potešil malou legendou :). Aj nabudúce :D

Nahoru Odpovědět  +2 10.10.2016 16:49
Find what you love and let it kill you.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 9 zpráv z 9.