Московский Авиационный Институт
(государственный технический университет) «МАИ»
УЦ МАИ «Интеграция»
Кафедра «Информатики и информационных технологий»
Специальность: 090104
«Комплексная защита объектов информатизации»
Курсовая работа
По дисциплине: «Интернет технологии»
Тема: «Создание интернет сайта»
Выполнил:
студент УЦ МАИ Седачев Александр Игоревич
Группа: 4Б - 507
Проверил: Боровков А.В.
Оценка ______ ____________________________
(дата, подпись преподавателя)
Серпухов 2012
Создание интернет сайта
В данной расчетно-графической работе мы создавали сайт на произвольную тему. Я выбрал центр активного отдыха в г.Тула – “Долина Х”.
Рис 1 - Главная страница сайта.
Рис.2 – Правила
Рис. 3 – Фотогалерея сайта
Рис. 4 - Отзывы
Рис. 5 – Оставить отзыв
Пример кода страницы Фотогалерея:
<head>
<script language="JavaScript" type="text/javascript">
var image_count = 6;
var interval = 3000;
var time_out = 15;
var i = 0;
var timeout;
var opacity = 100;
function change_image() {
opacity--;
var j = i + 1;
var current_image = 'img_' + i;
if (i == image_count) j = 1;
var next_image = 'img_' + j;
document.getElementById(current_image).style.opacity=opacity/100;
document.getElementById(current_image).style.filter='alpha(opacity='+opacity+')';
document.getElementById(next_image).style.opacity=(100-opacity)/100;
document.getElementById(next_image).style.filter='alpha(opacity='+(100-opacity)+')';
timeout = setTimeout("change_image()", time_out);
if (opacity==1) {
opacity = 100;
clearTimeout(timeout);
}
}
setInterval (function() {i++; if (i>image_count) i=1; change_image();}, interval);
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Фотографии</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
<link href="all.css" rel="stylesheet" type="text/css" />
<!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.thrColHybHdr #sidebar1, .thrColHybHdr #sidebar2 { padding-top: 30px; }
.thrColHybHdr #mainContent { zoom: 1; padding-top: 15px; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
#mainContent{width: 1000px; text-align: center;}
#mainContent h1{width: 1800px;}
div#rotator div { position:absolute;}
.style1 {color: #FFFF33}
.style2 {color: #FFFF00}
.style3 {
color: #000000;
font-weight: bold;
}
.стиль1 {color: #FFFFFF}
.стиль4 {color: #FFFFFF;
font-size: xx-large;
font-weight: bold;
}
.стиль5 {color: #FF0000;
font-size: xx-large;
font-weight: bold;
}
.стиль6 {color: #FF0000}
.стиль7 {color: #006699; }
.стиль8 {color: #990000}
-->
</style>
</head>
<body class="thrColHybHdr">
<div id="container">
<div id="header">
<h1 align="center" class="style1"> </h1>
<h1 align="center" class="style1"><span class="стиль4">Долина</span> <span class="стиль5">Х</span><span class="стиль1"> - Живи активно!</span></h1>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li>
<div align="center" class="style3"><a href="index.html">Главная</a> </div>
</li>
<li>
<div align="center" class="style3"><a href="rules.html">Правила</a></div>
</li>
<li>
<div align="center" class="style3"><a href="photos.html">Фотографии</a> </div>
</li>
<li>
<div align="center" class="style3"><a href="otzyv.html">Отзывы</a></div>
</li>
<li>
<div align="center" class="style3"><a href="saveotzyv.html">Оставить отзыв</a></div>
</li>
</ul>
<!-- end #header --></div>
<div id="sidebar1">
<div align="center"> <img src="images/Untitled-12.png" width="170" height="210" /> </div>
<h3 align="center" class="стиль7">В помощь посетителям</h3>
<ul>
<li><a href="#">Скидки</a></li>
<li><a href="#">Услуги</a></li>
<li><a href="#">Прайс</a></li>
<li><a href="#">Карта</a></li>
<li><a href="#">Новости</a><br />
</li>
</ul>
<p> <img src="images/snowbord1.jpg" width="158" height="117" />
</p>
<!-- end #sidebar1 --></div>
<div id="sidebar2">
<h3 align="center" class="style5 style2 стиль6" >Авторизуйся</h3>
<form action="forma.php" method="post" name="form_login">
<p>
<input name="login" type="text" value="Логин" maxlength="20" />
</p>
<p>
<input name="password" type="password" value="Пароль" maxlength="15" />
</p>
<p align="center">
<input name="submit" type="submit" value="Войти"/>
</p>
</form>
<p align="center"> <a href="#" class="стиль6">Забыли пароль?</a></p>
<p><img src="images/snowbord2.jpg" width="158" height="135" /> </p>
<p><img src="images/snowboard3.jpg" width="158" height="130" /></p>
<!-- end #sidebar2 --></div>
<div id="mainContent">
<h1 class="стиль8">Фотогалерея</h1>
<p align="center" class="стиль8"> </p>
<div> <img src='Dolina1.jpg' "width="500" height="400" id="img_1" style="position: absolute;">
<img src='Dolina2.jpg' "width="500" height="400"id="img_2" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
<img src='Dolina3.jpg' "width="500" height="400"id="img_3" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
<img src='Dolina4.jpg' "width="500" height="400"id="img_4" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
<img src='Dolina5.jpg' "width="500" height="400"id="img_5" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
<img src='Dolina6.jpg' "width="500" height="400"id="img_6" style="opacity: 0; filter: alpha(opacity=0);
position: absolute;">
</div>
</div>
<div>
<!-- end #mainContent -->
</div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="footer">
<p align="center">Седачев А.И. 4Б-507</p>
<!-- end #footer --></div>
<!-- end #container --></div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>
