Forum PHP.pl > Problem z menu pionowym

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki

Manwe89

1.04.2009, 12:32:39

Problem jest natury takiej:

[HTML] pobierz, plaintext 
<!DOCTYPE html 
	PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
 
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>Dokument</title>
	<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
</head>
 
<body>
	<div id="top">
		<div id="naglowek">Nagłówek szablonu</div>
		<div id="srodek">
			<div id="menu">
				<ul>
					<li><a href='#'>Element 1</a></li>
					<li><a href='#'>Element 2</a></li>
					<li><a href='#'>Element 3</a></li>
					<li><a href='#'>Element 4</a></li>
				</ul>
			</div>
			<div id="tresc">Treść strony</div>
		</div>
		<div id="stopka">Stopka serwisu</div>
	</div>
</body>
</html>
[HTML] pobierz, plaintext

i do tego plik css:

[HTML] pobierz, plaintext 
html, body {
	background-color: #f7f5e8;
	color: #000;
	margin: 0;
	padding: 0;
	font-family: Verdana;
	font-size: 10px;
}
 
#top {
	width: 784px;
	margin-left: auto;
	margin-right: auto;
}
 
#naglowek {
	background-color: #888;
}
#menu {
	width: 210px;
	float: left;
	overflow: hidden;
	background-color: #ccc;
}
 
#tresc {
	width: 570px;
	padding-top: 2px;
	padding-left: 2px;
	float: left;
	overflow: hidden;
}
 
#stopka {
	clear: both;
	width: 100%;
	background-color: #888;
}
 
ul, ul li {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}
 
ul {
	width: 200px;
	padding: 2px 2px 1px 2px;
	background-color: #d36974;
}
 
ul li {
	border-bottom: 1px solid #d36974;
}
 
ul a:link, ul a:visited {
	display: block;
	width: 176px;
	text-decoration: none;
	padding: 7px;
	font-weight: bold;
	background-color: #ae3340;
	color: #ebe5d5;
	border-left: 10px solid #81252f;
}
 
ul a:hover {
	width: 166px;
	background-color: #ebe5d5;
	color: black;
	border-left: 20px solid #81252f;
}
[HTML] pobierz, plaintext

I co nie działa? Otóż pod IE8 po najechaniu na dowolny element menu nie widac napisow, poniewaz kolor sie nie zmienia.
Sprawdzalem poprawnosc kodu na validatorze FF, na IE8 puscilem zeby sprawdzilo bledy i nic nie znalazlo. A co najdziwniejsze, kolor tla i grubosc ramki sie zmienia, tylko kolor czcionki nie. W czym może tkwić problem?

Lion_87

1.04.2009, 13:13:52

hmmm a jak byś dał zamias UL >> LI

czyli zamiast

Kod

ul a:link, ul a:visited {
...

ul a:hover {
...

tak:

Kod

li a:link, li a:visited {
...

li a:hover {
...

Manwe89

1.04.2009, 14:04:36

niestety to samo :/

i jeszcze jedno pytanko mam tak poza tematem ale nie bede nowego zakladal. Odnośnie jQuery. Jak zrobic w jQuery tak, aby po kliknieciu w dowolny link powstaly trzy akcje:

zanikniecie tekstu w 2sek (fadeOut(2000))
wczytanie tekstu (load("plik.txt"))
pojawienie tekstu w 2sek (fadeIn(2000))

ja to mam tak:

[HTML] pobierz, plaintext 
$(document).ready(
            function()
            {
                $("#link1").click(
                    function()
                    {
                        $("#tresc").fadeOut(2000).load("text2.txt").fadeIn(2000);
 
                 });
            });
[HTML] pobierz, plaintext

i dzieje sie tak: jednoczesnie zanika tekst i laduje sie nowy (tak wiec zanika de facto nowy) i potem znow sie pojawia. Da sie jakos wymusic zeby jedno po drugim robil? Fakt... rozjasnianie nastepuje po zaciemnieniu do konca ale ladowanie tekstu rowoczesnie z zaciemnianiem

kamil4u

1.04.2009, 14:45:20

Nie znam jQuery ale spróbuj tak:

Kod

$(document).ready(
function()
{
$("#link1").click(
function()
{
if($("#tresc").fadeOut(2000))
if($("#tresc").load("text2.txt"))
$("#tresc").fadeIn(2000);
});
});

Manwe89

1.04.2009, 17:07:25

to byla pierwsza wersja, ktora daje ten sam efeky

na mintAjaxie tak samo to dziala

no nic... bedzie trzeba sobie poradzic bez tego.

a zeby off topa nie bylo to ponawiam temat z gory bo dalej ten sam problem

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.