Загвоздка с css

Drink666 · July 14, 2009

Есть такая страничка

<!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">
<head>
<title>test jQuery</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
$("table.table_body > tbody > tr > td").css("vertical-align","top");

$("a").click(function(){$.get(this.href,function(data){
		$("#parents").css("display","none").empty().append(data).fadeIn("slow");
		});
	return false;})

$("a").ajaxStart(function(){
 $("body").append('<div class="black_fon"></div>');
 $('.black_fon').fadeTo(0,0.4);
 $(".popup").show();
 })
$("a").ajaxStop(function(){
 $(".popup").hide();
 $('.black_fon').remove();
 })

})

//]]>
</script>
<link rel="stylesheet" type="text/css" href="./style.css" />
<style type="text/css">
.popup{
display:none;
position: absolute;
left:50%;
top:50%;
width: 300px;
height: 300px;
margin-left: -150px;
margin-top: -150px;
z-index:20;
}
</style>
</head>
<body>
<div class="popup"><img src="loading1.gif" width="300" height="300" alt="" /></div>
<table class="table_body">
<tbody>
<tr>
 <td style="width:50px;">
  <a href="server.php?id=1">Перейти</a><br/>
  <a href="server.php?id=2">Перейти2</a>
 </td>
 <td >
  <div id="parents" style="text-align:justify"></div>
 </td>
</tr>
</tbody>
</table>
</body>
</html>

И CSS файл :

html{height:100%;}

body{height:100%; margin: 0px 0px 0px 0px;}

.table_body{
	min-width:100%;
	min-height: 100%;
	height:100%;
}

.black_fon{
background-color:#333333;
display:block;
position: fixed;
width:100%;
height:100%;
left: 0px;
top: 0px;
right: 0px;
bottom:0px;
z-index:10;
}

Так страничка работает как надо,при клике на ссылке страничка затемняется,мой див с картинкой загрузки вылетает на передней план,а потом все исчезает и показывается текст ... но досада в другом ,если перенести стиль .popup в файл style.css к остальным стилям ... сразу же начинаются какие-то чудеса ... тут же див становиться видимым и стиль,т.к стиль вообще не применяется к нему ... крутил, вертел,так разобраться и не смог ... проверял в 3 браузерах Firefox 3.5 , Opera 9.64 и IE 8 везде одно и тоже, решил обратиться к мудрецам на форум,разъясните пожалуйста такую загадку,я только начинаю осваивать CSS и вот такие грабли получись .... зарание большое спасибо.

Drink666 · July 15, 2009

Проблема решена ... почему то после того как я добавил в файл нужные мне строчки ... переименовал его в styles.css и прописал в линке этот файл ... все заработало и вот незадача ,так приходиться делать постоянно когда добавляешь новый стиль

Sign In

Загвоздка с css

Question

Drink666

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Drink666

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information