Suche im Forum:
Suchen


Autor Nachricht
Beitrag26.10.2008 um 11:03 (UTC)    
Titel: Darstellung Cool Menu

Hallo zusammen!

Habe gemerkt, dass mein Cool Menu (auf sufferingdragon.de.tl) in manchen Browsern nicht so dargestellt wird, wie ich es möchte. Ich möchte sie so haben, wie sie zB im IE oder Oper dargestellt wird. In Firefox wird steht sie allerdings in der 2. Box rechts.

Hier mal der Code, den ich verwende:
Code:
<center>
<div class="menu">
<li><a href="http://sufferingdragon.de.tl/Chat.htm" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Chat</a></li>
<li><a href="http://sufferingdragon.de.tl/G.ae.stebuch.htm" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Gästebuch</a></li>
<li><a href="http://sufferingdragon.de.tl/Archiv.htm" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Archiv</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
 <li><a href="http://sufferingdragon.de.tl/Blog_Archiv.htm">Blog Archiv</a></li>
 <li><a href="http://sufferingdragon.de.tl/Gedichte-Archiv.htm">Gedichte Archiv</a></li>
</ul>
</li>
<li><a href="http://sufferingdragon.de.tl/Forum/index.htm" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Forum</a></li>
<li><a href="http://sufferingdragon.de.tl/Links.htm" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Links</a></li>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
 <il><a href="http://ak-kreativesschreiben.de.tl">AK KS</a></li>
 <il><a href="http://franzi-and-paula.de">Fra./Pa. Fanpage</a></li>
</ul>
</li>
<li><a href="http://sufferingdragon.de.tl/Impressum.htm" onmouseover="montre('smenu6');" onmouseout="cache('smenu6');">Impressum</a></li>
</li>
</div>
</center>

ul, li {
list-style-type: none;
padding: 0px;
margin: 0px;}

li a {
text-align: center;
padding-top: 4px;}

.menu li {
width: 115px;
float: left;}

.menu a {
border: 2px outset #990000;
background-color: #990000;
background-image: url(http://img.webme.com/pic/s/sufferingdragon/button1.2.png);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block; 
color: #c0c0c0;
width: 115px;
height: 24px;}

.menu a:hover {
background-color: #000000;
border: 2px inset #990000; 
background-image: url(;
widt: 115px;
height: 24px;}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 {
font-size: 15px;
display: none;
float: left;}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: bold;
border-top: 0px;
cursor: pointer;
color: #c0c0c0;}

div.menu {
position: absolute;
z-index: 3;
top: 170px;
left: 50%;
margin-left:-365px;
width: 100%;}
</style>

<script type="text/javascript">
function montre(id) {
with (document) {
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';}}

function cache(id) {
with (document) {
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';}}
</script>


Danke schon mal!

lG, Toni
Beitrag29.10.2008 um 13:10 (UTC)    
Titel:

Hi noch mal!

Hat echt keiner eine Idee, woran das liegen könnte?
Beitrag29.10.2008 um 13:15 (UTC)    
Titel:

Also es wird blos woanders angezeigt, oder ist es verschoben oder sowas ??
Kannst du mal nen Screen machen ?
______________
Beitrag29.10.2008 um 13:41 (UTC)    
Titel:

Habe tagsüber IE 6 und damit ist Deine komplette Navi ineinander geschoben und verdeckt einen Teil des Content. Wollte Dir das nur mal als Info weitergeben, daß auch im IE die Navi nicht stimmt...

Grüßle
______________
Wir leben alle unter dem selben Himmel, aber wir haben nicht alle den selben Horizont. - Konrad Adenauer

Beitrag29.10.2008 um 13:57 (UTC)    
Titel:

Hmm... Komisch der Code ist doch eigentlich gut, und müsste für alle Systeme (Firefox, IE, Opera...) funktionieren da:

div.menu {
position: absolute;
z-index: 3;
top: 170px;
left: 50%;
margin-left:-365px;
width: 100%;}
</style>

...
Also bei mir stimmt alles, hab IE und Firefox ausgetestet

Greez
______________


Zuletzt bearbeitet von brand-designz am 29.10.2008, 14:58, insgesamt einmal bearbeitet
Beitrag29.10.2008 um 15:08 (UTC)    
Titel:

So. Hab das Menü jetzt positioniert. Jetzt ist es im IE6 (bei mir zumindest Wink) nicht mehr im Content.

Der Screen von mir, wie's bei mir in Firefox ausschaut:
http://img.webme.com/pic/s/sufferingdragon/screen_firefox.png
Beitrag29.10.2008 um 15:36 (UTC)    
Titel:

Das Collmenue kann eigentlich überhaupt nicht funktionieren, da du das Script auseinander gerissen hast.
Zitat:

<style type="text/css" media="screen">
<!--

/* Design verbreitern */
table.edit_main_table{width: 100% !important;}
td.edit_main_tr{width: 100% !important;}
table.edit_second_table{width: 100% !important;}
.........................
td.headline2 {
color: #990000;
font-face: Courier New, Comic Sans MS, Arial;
font-size: 18px;
font-weight: bold;
text-shadow: #770000 2px;}

<!-- keine Listenpunkte -->
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px;}


<!-- Entfernung Schrift vom Rand -->
li a {
text-align: center;
padding-top: 4px;}

<!-- Menübreite -->
...........
<!-- Farbe Menülink -->
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: bold;
border-top: 0px;
cursor: pointer;
color: #c0c0c0;
background-color: #000000;
background-image: url(http://img.webme.com/pic/s/sufferingdragon/button1.2.png);}


<!-- Menü oben positionieren -->
div.menu {
position: absolute;
z-index: 3;
top: 30%;
left: 57%;
margin-left:-45%;
width: 100%;}



<!-- Navi/Content/Box positionieren -->
td.edit_td_third_table{
padding-top:20px;
top: 50%;}

Das rote ist vom Menue, der Rest vom Design.
Zitat:
Beitrag29.10.2008 um 15:51 (UTC)    
Titel:

Und wie muss ich's dann machen, dass es klappt?
Beitrag29.10.2008 um 16:19 (UTC)    
Titel:

du hast bestimmt von den Ausbaustufen deiner Seite die Codes gespeichert. Nimm den letzten ohne Coolmenue und setze den ein.
Dann machst du dein Coolmenue neu, und kopierst es als Ganzes und erstes in "Text über dem Design". Alle anderen Anweisungen dann da drunter.
Beitrag30.10.2008 um 15:50 (UTC)    
Titel:

So. Danke erst mal @sc-hassel-jugend.

Das Cool Menu wird jetzt zwar in Firefox angezeigt (endlich ^^) aber senkrecht statt horizontal. In IE dagegen ist es horizontal (nur noch nicht positioniert Wink )

Jemand eine Idee, wie ich das in Firefox noch hinkriege?
Beitrag30.10.2008 um 16:05 (UTC)    
Titel:

Erster Versuch: Das steht bei dir als erstes im Code!
Zitat:

<style type="text/css" media="screen">

eigentlich muss das drin stehen
Zitat:

<style type="text/css">
<!--

Das wäre so der erste Schritt.
Beitrag30.10.2008 um 16:19 (UTC)    
Titel:

Ok hab ich. Und dann?
Beitrag30.10.2008 um 16:44 (UTC)    
Titel:

Jetzt nimmst du den kompletten Code vom Coolmenue raus und speicherst deine Seite. Das Menue dann hier posten
Beitrag30.10.2008 um 16:52 (UTC)    
Titel:

So. Also der Menücode:

Code:
<style type="text/css" media="screen">

ul, li {
list-style-type: none;
padding: 0px;
margin: 0px;}

li a {
text-align: center;
padding-top: 4px;}

.menu li {
width: 115px;
float: left;}

.menu a {
border: 2px outset #990000;
background-color: #990000;
background-image: url(http://img.webme.com/pic/s/sufferingdragon/button1.2.png);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
color: #c0c0c0;
width: 115px;
height: 24px;}

.menu a:hover {
background-color: #000000;
border: 2px inset #990000;
background-image: url(;
widt: 115px;
height: 24px;}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 {
font-size: 15px;
display: none;
float: left;}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: bold;
border-top: 0px;
cursor: pointer;
color: #c0c0c0;}

div.menu {
position: absolute;
z-index: 3;
top: 170px;
left: 50%;
margin-left:-365px;
width: 800px;}
</style>

<script type="text/javascript">
function montre(id) {
with (document) {
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';}}

function cache(id) {
with (document) {
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';}}
</script>



<center>
<div class="menu">
<li><a href="http://sufferingdragon.de.tl/Chat.htm" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Chat</a></li>
<li><a href="http://sufferingdragon.de.tl/G.ae.stebuch.htm" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Gästebuch</a></li>
<li><a href="http://sufferingdragon.de.tl/Archiv.htm" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Archiv</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
 <li><a href="http://sufferingdragon.de.tl/Gedichte-Archiv.htm">Gedichte Archiv</a></li>
</ul>
</li>
<li><a href="http://sufferingdragon.de.tl/Forum/index.htm" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Forum</a></li>
<li><a href="http://sufferingdragon.de.tl/Links.htm" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Links</a></li>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
 <il><a href="http://ak-kreativesschreiben.de.tl">AK KS</a></li>
 <il><a href="http://franzi-and-paula.de">Fra./Pa. Fanpage</a></li>
</ul>
</li>
<li><a href="http://sufferingdragon.de.tl/Impressum.htm" onmouseover="montre('smenu6');" onmouseout="cache('smenu6');">Impressum</a></li>
</li>
</div>
</center>
Beitrag30.10.2008 um 17:04 (UTC)    
Titel:

ich schaue mal nach was fehlt, einen Punkt habe ich schon.
PS: deine Seite sieht jetzt normal aus. Hier schon mal der erste Teil:
Zitat:

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana;
font-size: 14px;
overflow: auto;
padding: 0px;
margin: 0px;
}
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px;
}

li a
{
text-align: center;
padding-right:20px;
padding-top: 4px;
}

div.menu
{
position: absolute;
z-index: 1;
top: 173px;
left: 23%;
margin-left:0px;
width:580px;
}

.menu li {
width: 115px;
float: left;}

.menu a {
border: 2px outset #990000;
background-color: #990000;
background-image: url(http://img.webme.com/pic/s/sufferingdragon/button1.2.png);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
color: #c0c0c0;
width: 115px;
height: 24px;
}

.menu a:hover
{
background-color: #000000;
border: 2px inset #990000;
background-image: url();
width: 115px;
height: 24px;}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 ,#smenu6,
{
font-size: 15px;
display: none;
width: 115px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a,#smenu6 a, {
font-weight: bold;
border-top: 0px;
padding-top: 2px;
cursor: pointer;
color: #c0c0c0;
}

//-->
</style>


Zuletzt bearbeitet von sc-hassel-jugend am 30.10.2008, 18:35, insgesamt 2-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de