Показать сообщение отдельно
  #3 (permalink)  
Старый 25.11.2010, 08:13
Интересующийся
Отправить личное сообщение для dr.5y51em Посмотреть профиль Найти все сообщения от dr.5y51em
 
Регистрация: 23.09.2010
Сообщений: 18

Сделал, кому интересно, можете посмотреть. Украшать по вкусу

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript" src="jquery-1.4.2.js"></script>
<script language="javascript" type="text/javascript">
<!--
$(document).ready(function(){
	//$('div._div').css('width', '960px');
	$('#bg').css('width', $(window).width()*3+10+'px');
	$('#screen').css('width', $(window).width()+'px');
	$('#div1').css('margin-left', ($(window).width() - $('div._div').width())/2+'px');
	$('#div2').css('margin-left', ($(window).width() - $('div._div').width()) + 'px');
	$('#div3').css('margin-left', ($(window).width() - $('div._div').width()) + 'px');
});
function goleft1()
{
	$("#bg").animate({ 
    marginLeft: '-'+$(window).width()-6+'px'
  }, 1500 );
};
function goleft2()
{
	$("#bg").animate({ 
    marginLeft: '-'+$(window).width()-$(window).width()-12+'px'
  }, 1500 );
};
function gorigth1()
{
	$("#bg").animate({ 
    marginLeft: '0px'
  }, 1500 );
};
function gorigth2()
{
	$("#bg").animate({ 
    marginLeft: '-'+$(window).width()-6+'px'
  }, 1500 );
};
-->
</script>
<style type="text/css">
html body {
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	left: 0px;
	top: 0px;
	clip: rect(0px,auto,auto,0px);	
}
._div {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 24px;
	font-weight: bold;
	background-color: #999;
	border: 1px solid #000;
	width: 960px;
	display:inline-block;
	min-height:700px;
	position: relative;
}
#bg {
	background-color: #00F;
	border: 1px solid #000;
	min-height:768px;
	z-index:1;
}
#screen {
	position: fixed;
	min-width: 768px;
	z-index:2;
}
</style>
</head>

<body>
<div id="screen">
    <div id="bg">
        <div class="_div" id="div1">div 1 <a href="#" onclick="goleft1();">Туды =&gt;</a></div>
        <div class="_div" id="div2"><a href="#" onclick="gorigth1();">&lt;= Сюды</a> div 2 <a href="#" onclick="goleft2();">Туды =&gt;</a></div>
        <div class="_div" id="div3"><a href="#" onclick="gorigth2();">&lt;= Сюды</a> div 3</div>
    </div>
</div>
</body>
</html>
Ответить с цитированием