Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> Menu CSS nie działa w IE, Czy wie ktoś jak zmodyfikować dady kod Menu aby był on kompatybilny z
chomik21
post 10.08.2012, 10:03:25
Post #1





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 10.08.2012

Ostrzeżenie: (0%)
-----


Witam

Mam problem z Menu rozwijanym. Wstawiłem sobie eleganckie menu Css na blogu http://autawysokieobroty.blogspot.com/
No i wszystko działa w FF, Chrome, ale oczywiście IE stawia problemy. Próbowałem z plikiem .htc ale nie działa wraz
Poniżej podam kod tego że menu i jak toś wie jak go zmodyfikować prosiłbym o pomoc

Z góry dziękuję

<style>

/*------ CSS3 Drop Down Menu By MBT (www.mybloggertricks.com)---------*/

#mbt-menu, #mbt-menu ul {

margin: 0;

padding: 0;

list-style: none;

}

#mbt-menu {

width: 950px;

margin: 60px auto;

border: 1px solid #222;

background-color: #111;

background-image: -moz-linear-gradient(#444, #111);

background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111));

background-image: -webkit-linear-gradient(#444, #111);

background-image: -o-linear-gradient(#444, #111);

background-image: -ms-linear-gradient(#444, #111);

background-image: linear-gradient(#444, #111);

-moz-border-radius: 6px;

-webkit-border-radius: 6px;

border-radius: 6px;

-moz-box-shadow: 0 1px 1px #777;

-webkit-box-shadow: 0 1px 1px #777;

box-shadow: 0 1px 1px #777;

}

#mbt-menu:before,

#mbt-menu:after {

content: "";

display: table;

}

#mbt-menu:after {

clear: both;

}

#mbt-menu {

zoom:1;

}

#mbt-menu li {

float: left;

border-right: 1px solid #222;

-moz-box-shadow: 1px 0 0 #444;

-webkit-box-shadow: 1px 0 0 #444;

box-shadow: 1px 0 0 #444;

position: relative;

}

#mbt-menu a {

float: left;

padding: 12px 30px;

color: #999;

text-transform: uppercase;

font: bold 12px Arial, Helvetica;

text-decoration: none;

text-shadow: 0 1px 0 #000;

}

#mbt-menu li:hover > a {

color: #fafafa;

}

*html #mbt-menu li a:hover { /* IE8 only */

color: #fafafa;

}

#mbt-menu ul {

margin: 20px 0 0 0;

_margin: 0; /*IE8 only*/

opacity: 0;

visibility: hidden;

position: absolute;

top: 38px;

left: 0;

z-index: 9999;

background: #444;

background: -moz-linear-gradient(#444, #111);

background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));

background: -webkit-linear-gradient(#444, #111);

background: -o-linear-gradient(#444, #111);

background: -ms-linear-gradient(#444, #111);

background: linear-gradient(#444, #111);

-moz-box-shadow: 0 -1px rgba(255,255,255,.3);

-webkit-box-shadow: 0 -1px 0 rgba(255,255,255,.3);

box-shadow: 0 -1px 0 rgba(255,255,255,.3);

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

border-radius: 3px;

-webkit-transition: all .2s ease-in-out;

-moz-transition: all .2s ease-in-out;

-ms-transition: all .2s ease-in-out;

-o-transition: all .2s ease-in-out;

transition: all .2s ease-in-out;

}

#mbt-menu li:hover > ul {

opacity: 1;

visibility: visible;

margin: 0;

}

#mbt-menu ul ul {

top: 0;

left: 150px;

margin: 0 0 0 20px;

_margin: 0; /*IE8 only*/

-moz-box-shadow: -1px 0 0 rgba(255,255,255,.3);

-webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3);

box-shadow: -1px 0 0 rgba(255,255,255,.3);

}

#mbt-menu ul li {

float: none;

display: block;

border: 0;

_line-height: 0; /*IE8 only*/

-moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666;

-webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666;

box-shadow: 0 1px 0 #111, 0 2px 0 #666;

}

#mbt-menu ul li:last-child {

-moz-box-shadow: none;

-webkit-box-shadow: none;

box-shadow: none;

}

#mbt-menu ul a {

padding: 10px;

width: 130px;

_height: 10px; /*IE8 only*/

display: block;

white-space: nowrap;

float: none;

text-transform: none;

}

#mbt-menu ul a:hover {

background-color: #0186ba;

background-image: -moz-linear-gradient(#04acec, #0186ba);

background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));

background-image: -webkit-linear-gradient(#04acec, #0186ba);

background-image: -o-linear-gradient(#04acec, #0186ba);

background-image: -ms-linear-gradient(#04acec, #0186ba);

background-image: linear-gradient(#04acec, #0186ba);

}

#mbt-menu ul li:first-child > a {

-moz-border-radius: 3px 3px 0 0;

-webkit-border-radius: 3px 3px 0 0;

border-radius: 3px 3px 0 0;

}

#mbt-menu ul li:first-child > a:after {

content: '';

position: absolute;

left: 40px;

top: -6px;

border-left: 6px solid transparent;

border-right: 6px solid transparent;

border-bottom: 6px solid #444;

}

#mbt-menu ul ul li:first-child a:after {

left: -6px;

top: 50%;

margin-top: -6px;

border-left: 0;

border-bottom: 6px solid transparent;

border-top: 6px solid transparent;

border-right: 6px solid #3b3b3b;

}

#mbt-menu ul li:first-child a:hover:after {

border-bottom-color: #04acec;

}

#mbt-menu ul ul li:first-child a:hover:after {

border-right-color: #0299d3;

border-bottom-color: transparent;

}

#mbt-menu ul li:last-child > a {

-moz-border-radius: 0 0 3px 3px;

-webkit-border-radius: 0 0 3px 3px;

border-radius: 0 0 3px 3px;

}
* html #menu { zoom: 1; } /* IE6 */
*:first-child+html #menu { zoom: 1; } /* IE7 */

</style>

Ten post edytował chomik21 10.08.2012, 16:02:27
Go to the top of the page
+Quote Post
!*!
post 10.08.2012, 10:06:35
Post #2





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


Wstaw kod w tagi. Pokaż wersje live na http://jsfiddle.net/ i napisz co Ci nie działa. Poza tym trudno będzie to naprawić, bo IE>=8 nie wspiera CSS3 w całości. Zrób obejście w JS.

Ten post edytował !*! 10.08.2012, 10:07:44


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post
chomik21
post 10.08.2012, 14:31:32
Post #3





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 10.08.2012

Ostrzeżenie: (0%)
-----


Sorry ale nie wiem jak to zrobić
Nie mam zielonego pojęcia od czego zacząć
Go to the top of the page
+Quote Post
!*!
post 10.08.2012, 16:13:04
Post #4





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


http://forum.php.pl/index.php?s=&showt...st&p=896036
A taki to [html/css/php]Twójkod[/html/css/php] jak piszesz posty, zaznacz swój kod i użyj tagu w menu edycji.

Ten post edytował !*! 10.08.2012, 16:14:54


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post
chomik21
post 10.08.2012, 17:10:45
Post #5





Grupa: Zarejestrowani
Postów: 8
Pomógł: 0
Dołączył: 10.08.2012

Ostrzeżenie: (0%)
-----


Tak więc zrobiłem to jak należy i wyszedł komunikat
Your JS code is valid.
Czyli kod jest prawidłowy

No więc co mogę zrobić aby działał on w IE, w innych przeglądarkach działa bez problemu

Chodzi o Blog na Bloggerze

Ten post edytował chomik21 10.08.2012, 17:23:51
Go to the top of the page
+Quote Post
!*!
post 11.08.2012, 09:34:10
Post #6





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


Niby gdzie wyszedł Ci taki komunikat? Nadal nie podałeś linku.
Skoro nie działa w IE, to pisałem już, zrób dokładnie to samo, tylko że w JS np. w jQuery jest pełno skryptów tego typu. Zapisz to w osobnym pliku i użyj komentarzy warunkowych.

Ten post edytował !*! 11.08.2012, 09:34:26


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 19.06.2025 - 16:21