HTH-C.com - Forum
Latest News Latest Threads
Neuerung: Persönliche Galerie
Informationen zur Übernahme der Erweite..
HTH Blog - Version 2.0
#HTH.Systems - Betatester gesucht
Neueröffnung - PHPKit-Award.de
HTH Webchat v3
Letzter Beitrag Happy Birthday Bottyline Weiblicher Benutzer Heute, 0:00 Zeit der letzten Antwort
Letzter Beitrag Herzlich Willkommen Botty Männlicher Benutzer 22.11.2024 - 20:45 Zeit der letzten Antwort
Letzter Beitrag Gibt es eigentlich noch jemand der PHPki.. Dooki Männlicher Benutzer 16.07.2024 - 19:47 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 WEBI Männlicher Benutzer 24.06.2024 - 12:58 Zeit der letzten Antwort
Letzter Beitrag PHPKit 1.6.6 ohne ASCE auf PHP8x Myrddin Männlicher Benutzer 22.03.2023 - 12:36 Zeit der letzten Antwort
 55.784 Posts & 4.945 Themen in 78 Foren
Forenübersicht » Support / Hilfe » Allgemein » Verschiedenes » CSS Multi Menü Problem

CSS Multi Menü Problem
7 Beiträge in diesem Thema
 Seiten (1):    1  
Offline DustFireSky
Meister
DustFireSky`s alternatives Ego
Beiträge: 192
Wohnort: keine Angabe
HTH-Coins: 2.930
03.12.2016 - 15:48 Uhr
Beitrag: #1
Hallo liebe Leute,

ich habe da ein kleines, aber nervendes Problem mit meinem Multi CSS Menü.

Die Submenü Ebene 1 funktioniert: (PS: Der IMG Tag funktioniert hier nicht)
*Link entfernt*/images/Menu01.png

Sobald ich aber ein weiteres Submenü öffne funktioniert der Link aus Submenü 1 nicht mehr, der das zweite Submenü öffnet:
*Link entfernt*/images/Menu02.png

Es war ursprünglich nur ein Menü mit 1 Submenü Ebene! Ich habe das also selber versucht zu erweitern, jedoch habe ich da wohl entweder Denkfehler oder ich mache prinzipiell etwas falsch.

Hier ist der CSS Code:




1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195

PHP-Quelltext

/* Menu */
.menu {    
    position: relative;
    height: 40px;
    margin-left:5px;
    margin-right:5px;
     

    background: #ffec64;
    background: -webkit-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -moz-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -o-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -ms-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: linear-gradient(top, #ffec64  0%,#ffab23  100%);

    
    -webkit-border-radius: 20px 20px 0 0;
    -moz-border-radius: 20px 20px 0 0;
    
    border-radius:20px 20px 0 0;
}

.menu li {
    position: relative;
    list-style: none;
    float: left;
    display: block;
    height: 38px;
    z-index:999;
}

/* Links */

.menu li a {
    display: block;
    padding: 0 14px;
    margin: 6px 0;
    line-height: 28px;
    text-decoration: none;
    min-width:60px;
    text-align:center;    
    
    border-left: 1px solid #393942;
    border-right: 1px solid #4f5058;

    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;

    color:#090909;
    
    text-shadow: 0px 1px 1px rgba(204,51,0,.6);

    -webkit-transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -o-transition: color .2s ease-in-out;
    -ms-transition: color .2s ease-in-out;
    transition: color .2s ease-in-out;
}

.menu li:first-child a { border-left: none; }
.menu li:last-child a{ border-right: none; }

.menu li ul:first-child a {border: 1px solid #FFC966;}
.menu li ul:last-child a{ border: 1px solid #FFC966;}

.menu li ul li:first-child a {border: 1px solid #FFC966;}
.menu li ul li:last-child a{ border: 1px solid #FFC966;}

.menu li:hover > a { 
    background-color:#0C0C0C;
    color: #FFF; 
}

/* Sub Menu */
/* Erste Ebene */
.menu ul {
    position: absolute;
    top: 45px;
    left: -40px;
    opacity: 0;

    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;

    -webkit-transition: opacity .25s ease .1s;
    -moz-transition: opacity .25s ease .1s;
    -o-transition: opacity .25s ease .1s;
    -ms-transition: opacity .25s ease .1s;
    transition: opacity .25s ease .1s;
}
/* Zweite Ebene */
.menu ul li ul{
    position: absolute;
    top: 0;
    left:0;
    
    
    opacity: 0;

    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;

    -webkit-transition: opacity .25s ease .1s;
    -moz-transition: opacity .25s ease .1s;
    -o-transition: opacity .25s ease .1s;
    -ms-transition: opacity .25s ease .1s;
    transition: opacity .25s ease .1s;
}

.menu li:hover > ul { opacity: 1; }

.menu ul li {
    height: 0;
    overflow: hidden;
    padding: 0;
    background: #0C0C0C;

    -webkit-transition: height .25s ease .1s;
    -moz-transition: height .25s ease .1s;
    -o-transition: height .25s ease .1s;
    -ms-transition: height .25s ease .1s;
    transition: height .25s ease .1s;
    border: 1px solid #070707;    
}

.menu ul li ul li {
    height: 0;
    overflow: hidden;
    padding: 0;
    background: #0C0C0C;

    -webkit-transition: height .25s ease .1s;
    -moz-transition: height .25s ease .1s;
    -o-transition: height .25s ease .1s;
    -ms-transition: height .25s ease .1s;
    transition: height .25s ease .1s;
    border: 1px solid #070707;    
}


/* Erstes Submenü */
.menu li:hover > ul li {
    height: 26px;
    overflow: visible;
    left:0;
    padding: 0;
}
/* Zweites Submenü */
.menu li ul li:hover > ul li {
    top:-1px;
    height: 26px;
    overflow: visible;
    left:180px;

    padding: 0;
    
}

.menu ul li a {
    width: 176px;    
    padding: 0px 0 0px 40px;
    margin: 0;
    left:0;
    border: 1px solid #FFC966;
    color: #f2f2f2;
    text-align:left;
    font-size: 12px;
    font-weight:bold;
    line-height: 20px;    
    
}

.menu ul li:hover > a { color: #FFC966; }
.menu ul li:last-child a {  }

/* Submenü Icons */
.menu a.downloads { background: url(../images/kcmenu/download.png) no-repeat 6px center; }
.menu a.docs { background: url(../images/kcmenu/docs.png) no-repeat 6px center; }
.menu a.rss { background: url(../images/kcmenu/rss.png) no-repeat 6px center; }
.menu a.forum { background: url(../images/kcmenu/forum.png) no-repeat 6px center; }
.menu a.movie { background: url(../images/kcmenu/movie.png) no-repeat 6px center; }
.menu a.gbook { background: url(../images/kcmenu/book.png) no-repeat 6px center; }
.menu a.home { background: url(../images/kcmenu/home.png) no-repeat 6px center; }
.menu a.spend { background: url(../images/kcmenu/money.png) no-repeat 6px center; }
.menu a.muser { background: url(../images/kcmenu/user.png) no-repeat 6px center; }
.menu a.museredit { background: url(../images/kcmenu/user_profile.png) no-repeat 6px center; }
.menu a.mim { background: url(../images/kcmenu/im.png) no-repeat 6px center; }
.menu a.mimr { background: url(../images/kcmenu/im_received.png) no-repeat 6px center; }
.menu a.mims { background: url(../images/kcmenu/im_send.png) no-repeat 6px center; }
.menu a.mforum { background: url(../images/kcmenu/favorites.png) no-repeat 6px center; }
.menu a.msecrets { background: url(../images/kcmenu/secrets.png) no-repeat 6px center; }
.menu a.logout { background: url(../images/kcmenu/logout.png) no-repeat 6px center; }


Und hier der HTML Code (Ausschnitt):



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

PHP-Quelltext

<ul class="menu">
    <li><a href="?path=contentarchive&amp;type=4">Downloads</a>
        <ul>
            <li><a href="?path=contentarchive&amp;type=4&amp;catid=47" class="downloads">&raquo; ASCE Pluginsystem</a>
             <ul>
               <li><a href="?path=download&amp;contentid=557" class="downloads">&raquo; ASCE Pluginsystem 1.6.6</a></li>
               <li><a href="?path=download&amp;contentid=460" class="downloads">&raquo; ASCE Pluginsystem 1.6.5</a></li>
               <li><a href="?path=download&amp;contentid=559" class="downloads">&raquo; ASCE 1.6.6 Testscript</a></li>
             </ul>
            </li>
            <li><a href="?path=contentarchive&amp;type=4&amp;catid=52" class="downloads">&raquo; PHPKIT 1.6.6 ASCE Plugins</a>
             <ul>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=80" class="downloads">&raquo; 1.6.6 - Addons</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=81" class="downloads">&raquo; 1.6.6 - BB-Codes</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=82" class="downloads">&raquo; 1.6.6 - Codesnipsel</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=86" class="downloads">&raquo; 1.6.6 - Community Patches</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=83" class="downloads">&raquo; 1.6.6 - GSV und Module</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=84" class="downloads">&raquo; 1.6.6 - Navboxen</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=85" class="downloads">&raquo; 1.6.6 - Profil</a></li>
               <li><a href="?path=contentarchive&amp;type=4&amp;catid=52&amp;themeid=93" class="downloads">&raquo; 1.6.6 - Security Module</a></li>
             </ul>
            </li>
            <li><a href="?path=contentarchive&amp;type=4&amp;catid=51" class="downloads">&raquo; PHPKIT 1.6.5 ASCE Plugins</a></li>
            <li><a href="?path=contentarchive&amp;type=4&amp;catid=53" class="downloads">&raquo; PHPKIT 1.6.5&amp;1.6.6 Styles</a></li>
        </ul>
    </li>
</ul>


Im Klartext bedeutet das:

Hauptmenü (Funktioniert) => Erstes Submenü (Funktioniert) => Zweites Submenü (Öffnet sich, aber Link aus Submenü 1, der das zweite Submenü öffnete ist nicht mehr klickbar)

Wäre schön, wenn ein CSS Menümeister mir dabei helfen könnte. Ich fine den Fehler einfach nicht...  
 
Zum Anfang der Seite
Offline k!r!ka
Syntax undefine
k!r!ka`s alternatives Ego
Beiträge: 2.159
Wohnort: keine Angabe
HTH-Coins: 32.831
03.12.2016 - 18:56 Uhr
Beitrag: #2
Bin zwar kein Meister bei sowas, hab es aber trotzdem bei mir mal getestet.

Getestet mit folgenden Browsern:
Opera 12.15
Firefox 47.0.1

Ergebnis ist:
Die Einstellung opacity war in beiden Browsern immer irgendwie an etwas Schuld.


Bei Opera ging z.B. das Menu nicht mehr richtig zu:
http://abload.de/image.php?img=cssmenuopera1215hoverarkyy.png

Im Firefox wollte er Partout nicht den nachfolgenden Link im zweiten Untermenu nehmen. Stattdessen ging das zweite Untermenu des nächsten ersten Untermenu auf.
Also so:

Der Aufbau ist ja so.



1
2
3
4
5
6
7
8
9

Quellcode

ASCE Pluginsystem
> ASCE Pluginsystem 1.6.6
> ASCE Pluginsystem 1.6.5
..

PHPKIT 1.6.6 ASCE Plugins
> 1.6.6 - Addons
> 1.6.6 - BB-Codes
> ..
Wenn ich also auf ASCE Pluginsystem > ASCE Pluginsystem 1.6.5 wollte, ging das Menu für PHPKIT 1.6.6 ASCE Plugins auf und fokussierte dann 1.6.6 - Addons.


Lösung war bei mir (Änderungen sind markiert):



  • 1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198

    Quellcode

    /* Menu */
    .menu {    
             position: relative;
             height: 40px;
             margin-left:5px;
             margin-right:5px;
          

             background: #ffec64;
             background: -webkit-linear-gradient(top, #ffec64  0%,#ffab23  100%);
             background: -moz-linear-gradient(top, #ffec64  0%,#ffab23  100%);
             background: -o-linear-gradient(top, #ffec64  0%,#ffab23  100%);
             background: -ms-linear-gradient(top, #ffec64  0%,#ffab23  100%);
             background: linear-gradient(top, #ffec64  0%,#ffab23  100%);

         
             -webkit-border-radius: 20px 20px 0 0;
         -    moz-border-radius: 20px 20px 0 0;
         
             border-radius:20px 20px 0 0;
     }

     .    menu li {
             position: relative;
         list-    style: none;
             float: left;
             display: block;
             height: 40px;
             z-index:999;
     }

    /* Links */

    .menu li a {
             display: block;
             padding: 0 14px;
             margin: 6px 0;
             line-height: 28px;
             text-decoration: none;
             min-width:60px;
             text-align:center;    
         
             border-left: 1px solid #393942;
             border-right: 1px solid #4f5058;

             font-family: Arial, Helvetica, sans-serif;
             font-weight: bold;
             font-size: 14px;

             color:#090909;
         
             text-shadow: 0px 1px 1px rgba(204,51,0,.6);

         -    webkit-transition: color .2s ease-in-out;
         -    moz-transition: color .2s ease-in-out;
         -    o-transition: color .2s ease-in-out;
         -    ms-transition: color .2s ease-in-out;
             transition: color .2s ease-in-out;
     }

     .    menu li:first-child a { border-left: none; }
     .    menu li:last-child a{ border-right: none; }

     .    menu li ul:first-child a {border: 1px solid #FFC966;}
    .menu li ul:last-child a{ border: 1px solid #FFC966;}

    .menu li ul li:first-child a {border: 1px solid #FFC966;}
    .menu li ul li:last-child a{ border: 1px solid #FFC966;}

    .menu li:hover > a { 
             background-color:#0C0C0C;
             color: #FFF; 
    }

    /* Sub Menu */
     /* Erste Ebene */
    .menu ul {
             position: absolute;
             top: 40px; /* damit die UL-Box direkt unterhalb des LI-Element ist */
             left: -40px;
             padding-top: 5px; /* für den obigen Abstand */

             display: none; /* als Ersatz für opacity: 0; */

             -webkit-border-radius: 0 0 5px 5px;
         -    moz-border-radius: 0 0 5px 5px;
             border-radius: 0 0 5px 5px;

         -    webkit-transition: opacity .25s ease .1s;
         -    moz-transition: opacity .25s ease .1s;
         -    o-transition: opacity .25s ease .1s;
         -    ms-transition: opacity .25s ease .1s;
             transition: opacity .25s ease .1s;
     }
    /* Zweite Ebene */
    .menu ul li ul{
             position: absolute;
             top: 0;
             left:180px; /* Vertikaler Abstand für alle Untermenus (auch alle nachkommenden Ebenen) */
         
         
             padding-top: 0px; /* Damit die Untermenus nicht horizontal verrutschen */

             display: none; /* als Ersatz für opacity: 0; */

             -webkit-border-radius: 0 0 5px 5px;
         -    moz-border-radius: 0 0 5px 5px;
             border-radius: 0 0 5px 5px;

         -    webkit-transition: opacity .25s ease .1s;
         -    moz-transition: opacity .25s ease .1s;
         -    o-transition: opacity .25s ease .1s;
         -    ms-transition: opacity .25s ease .1s;
             transition: opacity .25s ease .1s;
     }
     .    menu li:hover > ul { display: block; } /* als Ersatz für opacity: 1; */

         .menu ul li {
             height: 0;
             overflow: hidden;
             padding: 0;
             background: #0C0C0C;

             -webkit-transition: height .25s ease .1s;
         -    moz-transition: height .25s ease .1s;
         -    o-transition: height .25s ease .1s;
         -    ms-transition: height .25s ease .1s;
             transition: height .25s ease .1s;
             border: 1px solid #070707;    
    }

     .    menu ul li ul li {
             height: 0;
             overflow: hidden;
             padding: 0;
             background: #0C0C0C;

             -webkit-transition: height .25s ease .1s;
         -    moz-transition: height .25s ease .1s;
         -    o-transition: height .25s ease .1s;
         -    ms-transition: height .25s ease .1s;
             transition: height .25s ease .1s;
             border: 1px solid #070707;    
    }


    /* Erstes Submen&uuml; */
    .menu li:hover > ul li {
             height: 26px;
             overflow: visible;
             left:0;
             padding: 0;
     }
    /* Zweites Submen&uuml; */
    .menu li ul li:hover > ul li {
             top:-1px;
             height: 26px;
             overflow: visible;
             left:0; /* Auf 0 gesetzt; der alte Wert 180px in die CSS-Klasse ".menu ul li ul" weiter oben als "left:180px;" */

             padding: 0;
         
     }

     .    menu ul li a {
             width: 176px;    
             padding: 0px 0 0px 40px;
             margin: 0;
             left:0;
             border: 1px solid #FFC966;
             color: #f2f2f2;
             text-align:left;
             font-size: 12px;
             font-weight:bold;
             line-height: 20px;    
         
     }

     .    menu ul li:hover > a { color: #FFC966; }
    .menu ul li:last-child a {  }

    /* Submen&uuml; Icons */
    .menu a.downloads { background: url(../images/kcmenu/download.png) no-repeat 6px center; }
     .    menu a.docs { background: url(../images/kcmenu/docs.png) no-repeat 6px center; }
     .    menu a.rss { background: url(../images/kcmenu/rss.png) no-repeat 6px center; }
     .    menu a.forum { background: url(../images/kcmenu/forum.png) no-repeat 6px center; }
     .    menu a.movie { background: url(../images/kcmenu/movie.png) no-repeat 6px center; }
     .    menu a.gbook { background: url(../images/kcmenu/book.png) no-repeat 6px center; }
     .    menu a.home { background: url(../images/kcmenu/home.png) no-repeat 6px center; }
     .    menu a.spend { background: url(../images/kcmenu/money.png) no-repeat 6px center; }
     .    menu a.muser { background: url(../images/kcmenu/user.png) no-repeat 6px center; }
     .    menu a.museredit { background: url(../images/kcmenu/user_profile.png) no-repeat 6px center; }
     .    menu a.mim { background: url(../images/kcmenu/im.png) no-repeat 6px center; }
     .    menu a.mimr { background: url(../images/kcmenu/im_received.png) no-repeat 6px center; }
     .    menu a.mims { background: url(../images/kcmenu/im_send.png) no-repeat 6px center; }
     .    menu a.mforum { background: url(../images/kcmenu/favorites.png) no-repeat 6px center; }
     .    menu a.msecrets { background: url(../images/kcmenu/secrets.png) no-repeat 6px center; }
     .    menu a.logout { background: url(../images/kcmenu/logout.png) no-repeat 6px center; }



Wobei ich mich gefragt habe wofür die overflow: visible|hidden; sein sollen. Bei mir gab es da keinen visuellen Effekt - ob nun da oder auskommentiert  


Zur Info vll. noch:
In Opera gibt es bei mir bei den Link:Hovern ein Problem - was ich so auch nicht wirklich lösen konnte. Statt den aktuell ausgewählten Link im Untermenu wird immer der darüberliegende Link gehovert (wenn der Link der erste ist passiert nichts). Keine Ahnung welche der Einstellungen Mist baut ^^""
 
Zum Anfang der Seite
Offline DustFireSky
Meister
DustFireSky`s alternatives Ego
Beiträge: 192
Wohnort: keine Angabe
HTH-Coins: 2.930
03.12.2016 - 19:41 Uhr
Beitrag: #3
Vielen Dank. Läuft alles bestens!

*Link entfernt*/include.php?path=start

Alle Fehler sind behoben   Ich hatte das Menü aus dem Internet. Hatte da lediglich das Design geändert und das zweite Menü eingefügt. Die visible Dinger waren schon da drin  cool Aber danke. Alles geht    
 
Zum Anfang der Seite
Offline k!r!ka
Syntax undefine
k!r!ka`s alternatives Ego
Beiträge: 2.159
Wohnort: keine Angabe
HTH-Coins: 32.831
03.12.2016 - 20:33 Uhr
Beitrag: #4
Nur zur Info  Bääääh (in Opera 12.15)

http://abload.de/image.php?img=image1exusg.png
 
Zum Anfang der Seite
Offline DustFireSky
Meister
DustFireSky`s alternatives Ego
Beiträge: 192
Wohnort: keine Angabe
HTH-Coins: 2.930
03.12.2016 - 21:15 Uhr
Beitrag: #5
Opera benutzt ja auch keiner mehr   Tja, im Firefox und Edge + IE ist alles toll   Keine Ahnung was das ist. Ich habe das 1:1 von dir übernommen. Hast du denn die aktuellste Opera Version ?

EDIT://

Habe mir den Opera mal heruntergeladen und nun sieht es auch dort normal aus  cool
Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von DustFireSky - 04.12.2016 - 04:34 Uhr
 
Zum Anfang der Seite
Offline k!r!ka
Syntax undefine
k!r!ka`s alternatives Ego
Beiträge: 2.159
Wohnort: keine Angabe
HTH-Coins: 32.831
04.12.2016 - 06:02 Uhr
Beitrag: #6
Die 12er Version ist auch nicht mehr die aktuellste. Aber eine der letzten vor den Neustart beim Browser-Hersteller (gab da irgendwie einen Umbruch).

Wie auch immer; ich könnte dir nichtmal genau sagen wo das Problem ist. Weder krieg ich diesen Dragonfly-Modus (aktuelles DOM angucken, bearbeiten etc.) bei dir zum laufen (war schon immer doof bei Opera [langsam, nur online verfügbar]; da macht Firefox nen besseren Job), noch komm ich mit Firefox (25.0.1, 47.0.1) auf deine Seite (403-Meldung). Lustigerweise krieg ich auch in Opera 10.00 mit "Als Opera ausgeben" eine 403-Meldung; bei "Als Firefox ausgeben" geht sie (aber noch kein Dragonfly-Modus enthalten) - versteh das einer .. ^^"" Und nein, im Firefox ist bis auf ein paar Kleinigkeiten in den Einstellungen (nicht den Config-Modus) nichts geändert.

Und wie gesagt; hatte den CSS-Code mit Opera 12.15 probiert. Siehst ja im Bild von oben - es ging ja. Wahrscheinlich wird einfach irgendeine Einstellung als Standard übernommen.

Du könntest ja (sofern natürlich die Lust vorhanden ;p) mal folgendes probieren:



1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

Quellcode

.menu {    
    position: relative;
    height: 40px;
    margin-left:5px;
    margin-right:5px;
       

    background: #ffec64;
    background: -webkit-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -moz-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -o-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: -ms-linear-gradient(top, #ffec64  0%,#ffab23  100%);
    background: linear-gradient(top, #ffec64  0%,#ffab23  100%);

      
    -webkit-border-radius: 20px 20px 0 0;
    -moz-border-radius: 20px 20px 0 0;
      
    border-radius:20px 20px 0 0;


    /* Änderung */
    margin-top: 0px;
    margin-bottom: 0px;
    padding: 0px;
  }
Vielleicht reicht das ja schon (also die Änderungen unten).
 
Zum Anfang der Seite
Offline DustFireSky
Meister
DustFireSky`s alternatives Ego
Beiträge: 192
Wohnort: keine Angabe
HTH-Coins: 2.930
04.12.2016 - 06:44 Uhr
Beitrag: #7
Das mit den Browserkennungen ist schnell erklärt  

Es war einmal ein Spambot, der kam immer unter ganz alten Browserkennungen daher, da packte der Webmaster den Vorschlaghammer aus und prügelte das einfach in eine .htaccess Datei. Tot war der Spambot. ENDE  lachend

Firefox Versionen kleiner als 48 und IE kleiner 11 werden blockiert. Dadurch habe ich 90 % weniger Spam auf der Seite  

Ich verstehe trotzdem nicht so recht, was du meinst. Das Menü ist ja an der richtigen Stelle. Oder meinst du das gelegentliche Springen ? Das liegt an dem Javascript was vorher geladen wird um die "Letzten Contents" anzuzeigen via Blätterfunktion. Wenn das aus ist springt das Teil auch nicht. Das Javascript behindert sogesehen das Rendern des Browsers bis das Script fertiggeladen ist. Das meinte auch Tante Google Pagespeed  cool Aber das ist zu verkraften.

Immerhin habe ich es geschafft das PHPKIT auf den Google Pagespeed Rank 97/100 zu bekommen. Der Rest lässt sich nicht ändern. Ist teils PHPKIT bedingt.

So sieht es bei mir im Opera aus:

*Link entfernt*/images/Menu03.png

Die Opera 10 Version ist nicht mehr die aktuellste. Da musste ich lachen  lachend Die aktuellste ist die Version 41!
Dieser Beitrag wurde bereits 3 mal editiert, zuletzt von DustFireSky - 04.12.2016 - 06:56 Uhr
 
Zum Anfang der Seite
 Seiten (1):    1  

Ähnliche Themen
 
Support Support » Multi-Video-Station - Letzte Antwort von DustFireSky am 21.01.13, 15:46 Multi-Video-Station  (21.01.13, 15:46)
Support Support » .MOV Dateien und Multi-Video-Station - Letzte Antwort von mono am 21.02.14, 13:01 .MOV Dateien und Multi-Video-Station  (21.02.14, 13:01)
Verschiedenes Verschiedenes » superfish menü - navbox - Letzte Antwort von k!r!ka am 28.01.14, 20:30 superfish menü - navbox  (28.01.14, 20:30)
Support Support » Staus menü und Usermap - Letzte Antwort von solingerjung am 29.10.07, 17:19 Staus menü und Usermap  (29.10.07, 17:19)
Support Support » probs mit der menü leiste - Letzte Antwort von BooGT am 11.12.06, 18:41 probs mit der menü leiste  (11.12.06, 18:41)
HTH-C.com - Webmedien & Community