Плавно показване на страница?

Ами, фона ми е черен... първо искам да се вижда само фона и постепенно да се покаже и съдържанието. Opacity започва от 0.1 и плавно стига до 1.0 :)
 
H_Kolev каза:
Ами, фона ми е черен... първо искам да се вижда само фона и постепенно да се покаже и съдържанието. Opacity започва от 0.1 и плавно стига до 1.0 :)
Да кажем,че целия сайт ти е в един див id=main_container
А на самия див му постави един display:none;
Код:
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
</head>
<div id="main_container" style="display:none;">
 <script>
$(document).ready(function() {
  $("div#main_container").fadeIn();
});
</script>
.......
tuk koda na saita
</div>
и би трябвало да стане.
Edit:Изисква jquery (дадох го в примерния код)
 
Така ми показва само черния фон... какво съм объркал...
Това е HTML:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="bg" xml:lang="bg">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<link rel="shortcut icon" href="/favicon.png" />
<title>Очаквайте скоро!</title>
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="bg" />
<link href="style.css" rel="stylesheet" type="text/css" />
<div id="container" style="display:none;">
<script>$("div#main_container").fadein();</script>
<img src="bg.png" />
</div>
</body>
<head>
</html>

Това е CSS:
[css]body {
background: #000;
}

#container {
margin-left: auto;
margin-right: auto;
width: 800px;
}[/css]
 
Не си дал линк към jquery ... копирай целия моя код и тествай (редактирах си поста)
 
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="bg" xml:lang="bg">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<link rel="shortcut icon" href="/favicon.png" />
<title>Очаквайте скоро!</title>
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="bg" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery.min.js"></script>
<div id="container"  style="display:none;">
 <script>
$(document).ready(function() {
  $("div#main_container").fadein();
});
</script>
<img src="bg.png" />
</div>
</body>
<head>
</html>

Пак не става...
 
Казах ти пробвай моя код,при твоя си объркал ID на дивът (main вместо main_container) и трябва да е .fadeIn(); не .fadein();
 
Сега го направих точно с твоя код, но ми показва само бял фон, нищо друго...
 
Сега го направих точно с твоя код, но ми показва само бял фон, нищо друго...
 
Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="bg" xml:lang="bg">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
<link rel="shortcut icon" href="/favicon.png" />
<title>Очаквайте скоро!</title>
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="bg" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery.min.js"></script>
<div id="main_container"  style="display:none;">
 <script>
$(document).ready(function() {
  $("div#main_container").fadeIn();
});
</script>
asdasdasd
</div>
</body>
<head>
</html>
ето ти твоя код, и моя код тествах и 2та работят...
не знам какво бъркаш. :lol:

във fadeIn() скобите можеш да сложиш примерно 2000 (за 2 секунди) защото ефекта е малко бърз според мен.
 
Ето снимка на това което ми показва в браузъра:
http://prikachi.com/images/83/6093083T.jpg
Ето снимка и на кода:
http://prikachi.com/images/92/6093092j.jpg
 
Просто изкопирай моя или твоя код,този който си снимал е объркан HEAD тага................
 
Стана :D леко бавен съм :D извинявай :) а може ли да се забави още показването на съдържанието?
 
Hous каза:
във fadeIn() скобите можеш да сложиш примерно 2000 (за 2 секунди) защото ефекта е малко бърз според мен.

явно не си го видял... просто промени fadein() на fadeIn(3000)
като 3000=3сек
 

Back
Горе