Подякувати Студентському архіву довільною сумою
Admin
26.02.2023 12:38
Дякуємо, що користуєтесь нашим архівом!
Розробка web-сайту “ Інтернет магазин цифрової техніки ” з використанням технології JavaScript.
Інформація про навчальний заклад
ВУЗ:
Національний університет Львівська політехніка
Інститут:
Інститут підприємництва та перспективних технологій
Факультет:
Не вказано
Кафедра:
Кафедра інформаційних систем і технологій
Інформація про роботу
Рік:
2009
Тип роботи:
Курсова робота
Предмет:
Web-технології
Група:
КН-44з
Частина тексту файла (без зображень, графіків і формул):
Міністерство освіти і науки України
Інститут підприємництва та перспективних технологій при
Національному університеті «Львівська політехніка»
Кафедра «Інформаційні системи і технології»
КУРСОВА РОБОТА
з дисципліни «Web-технології»
на тему:
Розробка web-сайту “ Інтернет магазин цифрової техніки ”
з використанням технології JavaScript.
Виконав студент групи КН-44з _________________
№ залікової книжки
Оцінка
Балів
Дата
Керівник роботи: Марусенкова Т.А.
Львів-2009
З А В Д А Н Н Я
на курсову роботу з дисципліни
" Web-технології "
студенту групи КН-44з
Т е м а: “ Розробка web-сайту “Інтернет магазин цифрової техніки”
з використанням технології JavaScript ”
ЗМІСТ ЗАВДАННЯ ТА КАЛЕНДАРНИЙ ПЛАН ЙОГО ВИКОНАННЯ
1.
Провести аналітичний огляд літератури по заданій темі.
2.
Визначити призначення сайту та майбутній функціонал.
3.
Вимоги до сайту:
Використовувати CSS.
Використовувати анімацію для тексту.
Усі посилання – відносні .
Розмір сторінки не перевищує 50 кб.
Реалізувати підміну зображень.
Реалізувати динамічне меню.
4.
Навести приклад роботи користувача з сайтом.
5.
Реалізувати та відлагодити функції JavaScript.
6.
Оформити записку до курсової роботи згідно вимог Міжнародних стандартів, дотримуючись такого змісту:
- вступ;
- формулювання задачі, методи та засоби її розв’язування;
- опис структури та роботи web-сайту;
- опис функцій на мові JavaScript;
- контрольний приклад та аналіз результатів комп'ютерної реалізації web-сайту;
- висновки;
- література;
- додатки
ЗАВДАННЯ ПРИЙНЯТО ДО ВИКОНАННЯ: ____________ 04.05.2009
пiдпис студента
Керівник роботи: _______________ / Марусенкова Т.А./
підпис керівника роботи
Вступ.
В даній курсовій роботі потрібно створити web-сайт “ Інтернет магазин цифрової техніки ” для супер-маркету цифрової техніки. В процесі розробки будуть використані знання по HTML, каскадних таблицях стилів та скриптовій мові JavaScript для написання функції, які будуть забезпечувати функціонал сайту, який не можна реалізувати виключно на HTML.
2. Формулювання задачі, методи та засоби її розв’язування
Мета : розробити веб-сайт, який буде містити інформацію про товари Інтернет магазину цифрової техніки. На сайті потрібно реалізувати : обробку інформації засобами JavaScript та представлення обробленої інформації користувачеві, можливість замовити товари через Інтернет.
Мова форматування Web-сторінок HTML спочатку вводилась як додаток SGML. HTML- документ складається з стандартних елементів розмітки, які відображуються лише визначеним чином. Набір елементів HTML – це типізація компонентів звичайного друкованого документа: заголовки, списки різних типів, параграфи, таблиці, цитування і т.п. При цьому всі елементи розділені на два типи: строкові і блочні. До других можна віднести параграф, список, таблицю. До строкових елементів – виділення курсивом або насищенністю, текст гіпертекстових посилань. Все це визначено в специфікації Document Type Definition HTML, яка формально записана на SGML[16].
Пізніше, з бурхливим розвитком WWW, HTML почав всіляко розширюватись з метою дати автору більший контроль над зовнішнім представленням інформації. Нові елементи й атрибути, такі як <FONT> <BGCOLOR>, орієнтувались на візуальне форматування. З’явились і стали активно використовуватись засоби, які не входить у мову розмітки: imagemaps, Java i JavaScript, plugins і т.д.
Багато з’явилось також елементів HTML, які підтримувались лише певним браузером, або які по-різному працюють в різних браузерах. Небагато сторінок створюються у відповідності із специфікаціями на HTML та відповідними DTD.
Цю проблему частково покликана полегшити підтримка так званих ієрархічних специфікацій Cascading Style Sheets (CSS), ), патентом на специфікацію яких володіє Microsoft. Але специфікація відноситься до категорії відкритих стандартів і може використовуватися всіма розробниками ПЗ для Web.
Ця технологія стала, з одного боку, розвитком HTML-розмітки, а з іншого – наступним кроком у напрямку до XML. Основна ідея CSS полягає в тому, щоб відділити логічну структуру документа від форми його представлення (способа форматування зображення на носієві).
З появою CSS в HTML стало можливим використання двох узагальнених елементів розмітки: DIV (узагальнений блок) і SPAN (узагальнений рядковий елемент розмітки). Тепер можна будувати логічну структуру документа, а потім визначати формат її відображення.
Цей підхід змінив всю технологію проектування сторінок Web-вузла. Тепер спочатку визначаються типи сторінок, потім логічна структура сторінки для кожного типа і в останню чергу для кожного логічного елемента визначається його склад і зовнішній вигляд.
Можливість вказання стилю у зовнішньому файлі дозволяє застосовувати одне визначення стилів для всього вузла і змінювати вигляд сторінок, редактуючи лише даний файл. Наступний крок на цьому шляху – динамічне переозначення стилю на стороні клієнта в залежності від умов відображення документа і дій користувача. Для програмування таких змін застосовуються мови типу JavaScript.
З прийняттям стандарту HTML 4.0 було введено немало важливих розширень для підтримки багатомовних документів і забезпечення доступності документів і забезпечення доступності документів у різних середовищах. Варто відмітити, що HTML – деякий синтез різних специфікацій Web, який увібрав у себе і URI у вигляді URL, і HTTP у вигляді http-equiv – модифікації елемента розмітки meta, і фрагменти програмного коду у вигляді елементів script, applet, embed і object, і таблиці стилів в атрибутах елементів розмітки та елементі style. Крім того, в HTML4 нарешті прямо в тексті стандарту чітко проведено розділ логічних і візуальних тегів (останні оголошені нерекомендованими). Там же наведене детальне обгрунтування цілей та ідеології мови – у специфікацію включено навіть короткий курс SGML та розбір HTML DTD. Існує три основні версії специфікацій HTML 4.0: строга, проміжна і фрейм-версія. Для кожної з трьох версій існує своє DTD[1].
Всі HTML-документи складаються з чотирьох частин:
Рядок визначення використовуваної версії HTML.
Елемент, який визначає документ як HTML-документ.
Секція опису заголовку, представлена елементом <HEAD>.
Тіло документа, тобто зміст. Тіло документа включається в
елементи <BODY> або <FRAMESET>.
Допустимим вважається документ, в якому вказана версія HTML, використана при формуванні документа. Версія задається в об’яві типу документа.
РОЗВИТОК WEB-ТЕХНОЛОГІЙ ЧЕРЕЗ ПРИЗМУ ПРОГРАМУВАННЯ Модель даних Web
І XML, і DHTML, і Java в кінцевому рахунку замкнулись на модель даних Web, множину сторінок Web, які, з точки зору розробників пошукових мов XML, є суцільним потоком різнотипних даних. Один документ (сторінка) – підмножина всіх документів (сторінок) Web. Модель даних Web визначають у вигляді графа – “ліс” з дерев.
Щоб представити предмет нашого обговорення у більш простому вигляді, візьмемо HTML-документ і “препаруємо” його з точки зору такої графової моделі даних. Весь документ – це один великий елемент розмітки HTML. При цьому документ є блочним елементом, який не може перетинатися з іншими документами, але може містити блоки, наприклад, HEAD і BODY. В свою чергу HEAD и BODY теж можуть включати інші блоки. При цьому елемент BODY в своїх атрибутах спроможний визначити властивості всього відображуваного тіла документа, наприклад, колір тексту, колір фону або колір гіпертекстових посилань. Якщо рухатись ще далі всередину BODY, то з дуже великою ймовірністю в типовому HTML-документі можна зустріти елемент розмітки ІМG, у якого є свої властивості.
Тепер назвемо вузли графа об’єктами, а програмам дозволимо змінювати властивості цих об’єктів. Скажемо, значення атрибута SRС у об’єкта, який відповідає елементу розмітки ІМG. При цьому виконувати такі зміни можна, використовуючи метод з набору стандартних методів, спільних як для сценаріїв мов, так і для Java. Все це утворює концепцію DOM - Document Object Model. Власне DOM – це інтерфейс прикладного програмування в рамках моделі даних Web або, іншими словами, набір стандартних методів об’єктів Web. Якщо треба вивести текст у тіло документа, це можна зробити будь-якою мовою програмування, яка підтримує DOM:
Document.write(<welcome>);
Тут задіяний стандартний метод write об’єкта document. Ім’я метода, значення, яке він повертає, аргументи метода і їх типи – все стандартизовано в DOM.
Таким чином, шлях розвитку Web-технології пролягає від статичної HTML-розмітки через скриптові мови, Java і DHTML до специфікацій XML і DOM. Зупинимось детальніше на етапах цього шляху.
ЕВОЛЮЦІЯ WEB-ТЕХНОЛОГІЙ.
Жорсткі правила відображення елементів на ранніх стадіях становлення Web-технології дозволяли забезпечити чіткі і зрозумілі вимоги до браузерів, а також можливість швидкого наповнення Web інформацією. В міру збільшення кількості інформації і ускладнення структури набору документів Web-вузлів простота технології стала перетворюватись на недолік. Доводилось копіювати фрагменти коду, вводити нові елементи розмітки для варіювання форматів зображення в залежності від контексту, підтримувати все більш складні формати графічних файлів.
Cтворення Web-вузлів перетворилось сьогодні в окремий вид професійної діяльності. При цьому вузел став самостійним товаром, вартість якого не повинна перевищувати розумних меж, визначених його функціональним призначенням (віртуальний магазин, інформаційна служба, ядро корпоративної системи і т.п.). Виходячи з цього, сформувалось певне розуміння складу функцій ПЗ Web-вузла, типізації сторінок Web-вузла за їх функціональним призначенням, складу компонентів і методів обробки інформації на сторінках.
Прикладне програмування для Web починалось з обробки запитів користувача і динамічної генерації сторінок на стороні сервера. Ця ж тенденція отримала розвиток і у мовах програмування вставок в HTML-документи. Потім з’явились мови програмування елементів HTML-документів на стороні клієнта. І ті, й інші прив’язані до моделі даних HTML. Сьогодні, коли Web мігрує до стеку специфікацій XML, розробники засобів програмування повинні це врахувати і правильно відреагувати, дозволивши, наприклад, маніпулювати елементами XML-розмітки. Стандарт, покликаний позначити і вирішити цю задачу, отримав назву Document Object Model - DOM.
Паралельно з процесом розвитку формального статичного опису змісту документа розвивались і способи його зміни. Спочатку вони були означені в JavaScript, потім мова програмування Java дозволила розміщувати всередині документа і видозмінювати інформацію будь-якого типу. Поява VBScript і JScript означала, що Microsoft рухається у тому ж напрямку. Поступово технологія Java опустилась до рівня засобів розробки додатків Web, а сценарний напрямок оформився в концепцію DHTML (Dynamic HTML).
3. Опис структури та роботи web-сайту.
Веб-сторінка складається з таких функціональних та інформаційних елементів: шапка сайту, динамічне навігаційне меню, форма для замовлення товару, головний контейнер який містить основну інформаційну частину сайту.
Шапка сайту:
Динамічне меню:
При наведенні курсора на пункт меню, змінюється колір елемента меню та з’являється підменю активний елемент якого теж підсвічується .
Форма для замовлення товару:
При натисканні по посиланню «замовити» в головному контейнері, автоматично заповнюється форма замовлення товару. Передаються значення назва, код і ціна товару. В формі також реалізований функціонал конвертування ціни товару з гривневого в доларовий і навпаки.
Головний контейнер
Вигляд сайту у браузері Firefox.
Щоб придбати товар користувачу достатньо клацнути по посиланню «замовити», після чого інформація про товар з’явиться у формі замовити, далі потрібно заповнити порожні поля і натиснути кнопку «замовити товар».
4. Опис функцій на мові JavaScript
Функція function gebid(number) реалізована для заповнення полів форми інформацією про товар який вибирає користувач.
function gebid(number){
var xyz=document.getElementById(number);
document.formo4ka.nametov.value = xyz.name;
document.formo4ka.idtov.value = xyz.id;
var mynode = document.getElementById(xyz.id).parentNode;
var pos = mynode.innerHTML.indexOf("$");
var pos2 = mynode.innerHTML.indexOf(".00") - pos;
var subst = mynode.innerHTML.substr(pos+1, pos2-1) + '' +'$';
document.formo4ka.prtov.value = subst;
document.getElementById("submit").value = 'Замовити зараз' + ' ' + document.formo4ka.idtov.value;
var fname=document.formo4ka.name;
var col1="yellow";
var col2="cyan";
if (fname=="formo4ka") {
document.formo4ka.style.background = col1;
document.formo4ka.name = "formo4ka1";
}
else
{
document.formo4ka1.name="formo4ka";
document.formo4ka.style.background = col2;
}
}
Функція function valuta(v) реалізована для конвертації ціни товару згідно курсу вибраної користувачем грошової одиниці .
function valuta(v) {
alert(parseInt(v));
if (parseInt(v) == 11) {
alert(parseInt(v));
if (document.formo4ka.prtov.value.indexOf("$")>-1) {
return(false);
}
else {
document.formo4ka.prtov.value = ((parseInt(document.formo4ka.prtov.value))/7) + '$';
}}
if (parseInt(v) == 22) {
alert(parseInt(v));
if (document.formo4ka.prtov.value.indexOf("грн")>-1) {
return(false);
} else {
document.formo4ka.prtov.value = ((parseInt(document.formo4ka.prtov.value))*7) + 'грн.';
}}}
Функція checkemail(str) виконує перевірку правильності синтаксису введеної користувачем email адреси.
function checkemail(str) {
var r1 = new RegExp("(@.*@)|(\\.\\.)|(@\\.)|(^\\.)");
var r2 = new RegExp("^.+\\@(\\[?)[a-zA-Z0-9\\-\\.]+\\.([a-zA-Z]{2,3}|[0-9]{1,3})(\\]?)$");
var isOK = !r1.test(str) && r2.test(str);
if (!isOK)
alert('Невірний Email!');
return isOK; }
5. Контрольний приклад
Заходимо на веб-сайт, вибараємо товар і натискаємо книпку «замовити».
Як видно на малюнку тепер форма замовлення містить інформацій про товар який ми хочемо замовити. Залишається заповнити порожні поля форми і натиснути кнопку «Замовити зараз».
Висновки: результатом виконання завдання курсової роботи є веб – сайт написаний на HTML з використанням мови програмування JavaScript для розширення функціональності сайту та взаємодії з користувачем. При виконанні завдання були закріпленні знання отримані на практичних, лабораторних та семінарських заняттях, а також здобуті нові знання у процесі написання нестандартних функції та їх відлагодженні.
Література :
Веб-сайт http://www.w3schools.com
Веб-сайт http://www.htmlbook.ru
Веб-сайт http://html.manual.ru/
ISBN 5-318-00368-0; Видавництво: Питер, 2001 г.;304 ст.;
Додаток 1. лістинг файлу public.css
body {background-image:url(bg.gif);}
table.maintable {
border-width:0px;
border-color:red;
border-style:dashed;
background-color:white;
}
div.tovar {
width:180px;
height:200px;
border:0px dashed black;
padding:10px;
margin-bottom:30px;
background-repeat:no-repeat;
background-position:center;
background-position:bottom;
background-image:url(wer.jpg);
}
//div img {height:60px;}
input.bigbutton {
display:block;
width:140px;
height:50px;
font-size:12px;
text-align:center;
}
.zamo {
display:block;
position:fixed;
top:590;
}
# goods td{
align:center;
background-color:red;
}
p.tovp {
display:block;
width:140px;
height:44px;
font:10px Verdana;
}
p.price {
width:100px;
font:18px Verdana;
color:green;
background-color:yellow;
margin-top:5px;
text-align:center;
}
#form {
width: 150px;
margin: 10px;
position:fixed;
top:200px;
}
h2.men {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}
ul.men {
list-style: none;
margin: 0;
padding: 0;
}
img.men {
border: none;
}
#menu6 {
width: 150px;
margin: 10px;
position:fixed;
top:590px;
}
#menu6 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}
#menu6 li a:link, #menu6 li a:visited {
color: black;
display: block;
background: url(menu6.gif);
padding: 8px 0 0 10px;
font-weight:bold;
}
#menu6 li a:hover, #menu6 li #current {
color: #FFF;
background: url(menu6.gif) 0 -32px;
padding: 8px 0 0 10px;
}
p.b1 {
color:white;
font-size:50px;
float:left;
position:relative;
top:10px;
width:35px;
margin-top:5px;
}
p.b2 {
font-size:50px;
float:left;
position:relative;
top:19px;
width:35px;
margin-top:5px;
}
p.b3 {
color:white;
font-size:50px;
float:left;
position:relative;
top:15px;
width:35px;
margin-top:5px;
}
p.b4 {
font-size:50px;
float:left;
position:relative;
width:35px;
margin-top:5px;
}
#maint tr td #form {
font-size: 12px;
}
Додаток 2. Лістинг файлу index.html
<html>
<head>
<link href="public.css" type="text/css" rel="stylesheet">
</head>
<body leftmargin='15' topmargin='15' >
<table class="maintable" width=1000 id="maint" cellspacing="0" border="0" align="center" bgcolor="#A0A0A4">
<tr><td style="background-color: #FF952B;" width="190px" valign="top">
</td>
<td style="background-color: #FF9F40;">
<p class="b1">С</p>
<p class="b2">в</p>
<p class="b3">і</p>
<p class="b4">т</p>
<p class="b1"> </p>
<p class="b2">Ц</p>
<p class="b3">и</p>
<p class="b4">ф</p>
<p class="b1">р</p>
<p class="b2">о</p>
<p class="b3">в</p>
<p class="b4">о</p>
<p class="b1">ї </p>
<p class="b2"> </p>
<p class="b3">Т</p>
<p class="b4">е</p>
<p class="b1">х</p>
<p class="b2">н</p>
<p class="b3">і</p>
<p class="b4">к</p>
<p class="b1">и</p>
</td><td width=10px style="background-color: #FF8C1A;"> </td></tr>
<tr><td style="background-color: #FF9F40">
</td><td align="center" style="background-color: #FF9428;" ><div id="menushka" style="padding:0;height:90%;margin-left:10px;margin-top:20px;" >
<script language="JavaScript" vqptag="doc_level_settings" is_vqp_html=12 vqp_datafile0="new_menu1-2.js" vqp_uid0=12>cdd__codebase = "";cdd__codebase12 = "";</script>
<script language="JavaScript" vqptag="datafile" src="new_menu1-2.js"></script><script vqptag="placement" vqp_menuid="12" language="JavaScript">create_menu(12)</script>
</div>
</td><td style="background-color: #FF9F40;"> </td></tr>
<tr><td align=center valign=top style="background-color: #FF9428;">
<form onSubmit="return checkemail(this.mail.value)"id="form" name="formo4ka">
<b>Форма замовлення:</b><br /><br />
Назва товару:<br />
<textarea type="text" rows="3" cols="15" name="nametov"></textarea><br />
код товару:<br />
<input type="text" name="idtov"><br />
ціна:<br />
<input type="text" name="prtov"><br />
Ваше ім'я:<br />
<input type="text" name="firtstname"><br />
Ваше Прізвище:<br />
<input type="text" name="secondname"><br />
Грошова одиниця:<br />
<select name="val" id="val">
<option value="USD" id="11" onclick="valuta(this.id)">USD</option>
<option selected value="UAH" id="22" onclick="valuta(this.id)">UAH</option>
</select>
<br />
@mail:<br />
<input type="text" name="mail"><br />
<br />
<input type="submit" id="submit" name="submit" value="Замовити товар"><br />
</form>
<br /><br /><br />
<!--<div class="zamo">
<span id style="float:left;margin-left:10px;">Пам'ятки</span>
<br />
<ul style="margin:0px; padding:0px; list-style-image:none; list-style:none">
<li style="margin:0px; font-size:12px; width:180px; height:40px; padding:0px; list-style-image:none; list-style:none">
<img src="img/minus.bmp" id="li1" onClick="expandList(this.id)" style="list-style-type:none">Переглянути<ul id="list">
</ul></li></ul>
</div>-->
<div id="menu6">
<ul class="men">
<li><a href="page.html">Прайс лист</a></li>
<li><a href="page1.html">Фотоапарати</a></li>
<li><a href="page2.html">Телевізори</a></li>
<li><a href="page3.html">Монітори</a></li>
<li><a href="page4.html">Музичні центри</a></li>
<li><a href="page5.html">МП3 плеєри</a></li>
</ul>
</div>
</td><td style="padding-top:50px;background-color: #FF9F40;">
<h1 align=center> Найпопулярніші товари </h1>
<table align=center id="goods" style="background-color: #FF9F40;">
<tr>
<td align="center" >
<div class="tovar">
<p class="tovp" >DELL XPS M1330 (M1330 T8100 R2 H250VHP Blue)</p>
<img src="img26569.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="DELL XPS M1330 (M1330 T8100 R2 H250VHP Blue)" id="1001" onclick="gebid(this.id);chcolor()">Замовити</a> $769.00</p>
</div>
</td>
<td align="center">
<div class="tovar">
<p class="tovp">DELL XPS M1330 (M1330 T8100 R2 H250VHP Black)</p>
<img src="img26570.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="DELL XPS M1330 (M1330 T8100 R2 H250VHP Black)" id="1002" onclick="gebid(this.id)">Замовити</a> $789.00</p>
</div>
</td>
<td align="center"><div class="tovar">
<p class="tovp">Sony Walkman NWZ-A816 4Gb White</p>
<img src="img06060.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-A816 4Gb White" id="1003" onclick="gebid(this.id)">Замовити</a> $43.00</p>
</div>
</td>
</tr>
<tr>
<td align="center"><div class="tovar">
<p class="tovp">Sony Walkman NWZ-S616F Silver 4Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 4Gb" id="1004" onclick="gebid(this.id)">Замовити</a> $45.00</p></div>
</td>
<td align="center"><div class="tovar">
<p class="tovp">Sony Walkman NWZ-S616F Silver 8Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 8Gb" id="1005" onclick="gebid(this.id)">Замовити</a> $50.00</p></div>
</td>
<td align="center"><div class="tovar">
<p class="tovp">Sony Walkman NWZ-S616F Silver 16 Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 16 Gb" id="1006" onclick="gebid(this.id)">Замовити</a> $65.00</p></div>
</td>
</tr>
<tr>
<td align="center"><div class="tovar"><p class="tovp">Sony Walkman NWZ-S616F Silver 16 Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 16 Gb" id="1006" onclick="gebid(this.id)">Замовити</a> $65.00</p></div>
</div></td>
<td align="center"><div class="tovar"><p class="tovp">Sony Walkman NWZ-S616F Silver 16 Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 16 Gb" id="1006" onclick="gebid(this.id)">Замовити</a> $65.00</p></div>
</div></td>
<td align="center"><div class="tovar"><p class="tovp">Sony Walkman NWZ-S616F Silver 16 Gb</p>
<img src="img06074.jpg">
<p align=center style="font:bolt 12px Verdana;" class="price">
<a href="#" name="Sony Walkman NWZ-S616F Silver 16 Gb" id="1006" onclick="gebid(this.id)">Замовити</a> $65.00</p></div>
</div></td></tr>
</table>
</td><td style="background-color: #FF9428;" > </td></tr>
<tr><td style="background-color: #FF9F40;"> </td><td style="background-color: #FF9428;" > </td><td style="background-color: #FF9F40;"> </td></tr>
</table>
</body>
</html>
Додаток 3. лістинг файлу new_menu1-2.js
function cdd_menu12(){//////////////////////////Start Menu Data/////////////////////////////////
this.uid = 12
/**********************************************************************************************
Icon Images
**********************************************************************************************/
//Inline positioned icon images (flow with the item text)
this.rel_icon_image0 = "squares_0.gif"
this.rel_icon_rollover0 = "squares_0_hl.gif"
this.rel_icon_image_wh0 = "13,8"
/**********************************************************************************************
Global - Menu Container Settings
/*********************************************************************************************/
this.menu_background_color = "#80FF00"
this.menu_border_color = "#000000"
this.menu_border_width = 1
this.menu_padding = "2,4,2,4"
this.menu_border_style = "solid"
this.divider_caps = false
this.divider_width = 2
this.divider_height = 2
this.divider_background_color = "#ffffff"
this.divider_border_style = "none"
this.divider_border_width = 0
this.divider_border_color = "#000000"
this.menu_is_horizontal = false
this.menu_width = "130"
this.menu_xy = "-100,-2"
this.menu_scroll_direction = 1
this.menu_scroll_reverse_on_hide = true
this.menu_scroll_delay = 0
this.menu_scroll_step = 5
this.menu_animation = "progid:DXImageTransform.Microsoft.Strips(duration=0.3,motion=leftdown)"
/**********************************************************************************************
Global - Menu Item Settings
**********************************************************************************************/
this.icon_rel = 0
this.menu_items_background_color_roll = "#80FF00"
this.menu_items_text_color = "#000000"
this.menu_items_text_decoration = "none"
this.menu_items_font_family = "Arial"
this.menu_items_font_size = "11px"
this.menu_items_font_style = "normal"
this.menu_items_font_weight = "normal"
this.menu_items_text_align = "left"
this.menu_items_padding = "4,5,4,5"
this.menu_items_border_style = "solid"
this.menu_items_border_color = "#ffffff"
this.menu_items_border_width = 0
this.menu_items_width = 110
this.menu_items_background_color = "#ffffff"
this.menu_items_text_color_roll = "#000000"
this.menu_items_border_color_roll = "#ffffff"
/**********************************************************************************************
Main Menu Settings
**********************************************************************************************/
this.menu_background_color_main = "#80FF80"
this.menu_items_background_color_main = "#ffffff"
this.menu_items_background_color_roll_main = "#ffffff"
this.menu_items_text_color_main = "#0f0f0f"
this.menu_items_text_color_roll_main = "#000000"
this.menu_border_color_main = "#000000"
this.menu_items_border_color_main = "#000000"
this.menu_items_border_color_roll_main = "#000000"
this.menu_items_text_align_main = "left"
this.menu_is_horizontal_main = true
this.divider_background_color_main = "#000000"
this.item0 = "Головна"
this.item1 = "Цифрова техніка"
this.item2 = "Акції"
this.item3 = "Кредит"
this.item4 = "Консультація"
this.item_background_color0 = "#ffffff"
this.item_background_color_roll0 = "#80FF80"
this.item_text_color0 = "#000000"
this.item_text_color_roll0 = "#000000"
this.item_background_color1 = "#ffffff"
this.item_background_color_roll1 = "#80FF80"
this.item_text_color_roll1 = "#000000"
this.item_background_color2 = "#ffffff"
this.item_background_color_roll2 = "#80FF80"
this.item_text_color_roll2 = "#000000"
this.item_text_align2 = "left"
this.item_background_color3 = "#ffffff"
this.item_background_color_roll3 = "#80FF80"
this.item_text_color_roll3 = "#000000"
this.item_border_color3 = "#000000"
this.item_border_color_roll3 = "#000000"
this.item_text_align3 = "left"
this.item_background_color4 = "#ffffff"
this.item_background_color_roll4 = "#80FF80"
this.item_text_color_roll4 = "#000000"
/**********************************************************************************************
Sub Menu Settings
*********************************************************************************************/
//Sub Menu 0
//Sub Menu 1
this.menu_width1 = 131
this.item1_0 = "Фото"
this.item1_1 = "Відео"
this.item1_2 = "Аудіо"
this.item1_3 = "Екстра"
this.url1_0 = "sample_link.html"
this.url1_1 = "sample_link.html"
this.url1_2 = "sample_link.html"
this.url1_3 = "sample_link.html"
//Sub Menu 2
this.item2_0 = "Сьогодні"
this.item2_1 = "Завтра"
this.item2_2 = "Найближчим часом"
this.item2_3 = "Плануємо"
this.item_text_align2_0 = "left"
this.item_text_align2_1 = "left"
this.item_text_align2_2 = "left"
this.item_text_align2_3 = "left"
this.url2_0 = "sample_link.html"
this.url2_1 = "sample_link.html"
this.url2_2 = "sample_link.html"
this.url2_3 = "sample_link.html"
//Sub Menu 3
this.menu_background_color3 = "#80FF00"
this.menu_items_background_color3 = "#ffffff"
this.menu_border_color3 = "#000000"
this.menu_width3 = 130
this.item3_0 = "Про кредит"
this.item3_1 = "Для фіз. осіб"
this.item3_2 = "Для юр. осіб"
this.item3_3 = "Без відсотковий"
this.item_background_color3_0 = "#ffffff"
this.item_background_color_roll3_0 = "#80FF00"
this.item_background_color3_1 = "#ffffff"
this.item_background_color3_2 = "#ffffff"
this.item_background_color3_3 = "#ffffff"
this.item_border_color3_3 = "#ffffff"
this.url3_0 = "sample_link.html"
this.url3_1 = "sample_link.html"
this.url3_2 = "sample_link.html"
this.url3_3 = "sample_link.html"
//Sub Menu 4
this.item4_0 = "Фото"
this.item4_1 = "Відео"
this.item4_2 = "Аудіо"
this.item4_3 = "Екстра"
this.item4_4 = "Кредит"
this.url4_0 = "index2.html target=_blank"
this.url4_1 = "index2.html"
this.url4_2 = "index2.html"
this.url4_3 = "index2.html"
this.url4_4 = "index2.html"
}///////////////////////// END Menu Data /////////////////////////////////////////
//Document Level Settings
cdd__activate_onclick = false
cdd__showhide_delay = 100
cdd__url_target = "_self"
cdd__url_features = "resizable=1, scrollbars=1, titlebar=1, menubar=1, toolbar=1, location=1, status=1, directories=1, channelmode=0, fullscreen=0"
cdd__display_urls_in_status_bar = true
cdd__default_cursor = "hand"
if (window.showHelp){b_type = "ie"; if (!window.attachEvent) b_type += "mac";}if (document.createElementNS) b_type = "dom";if (navigator.userAgent.indexOf("afari")>-1) b_type = "safari";if (window.opera) b_type = "opera"; qmap1 = "\<\script language=\"JavaScript\" vqptag='loader_sub' src=\""; qmap2 = ".js\">\<\/script\>";;function iesf(){};;function vqp_error(val){alert(val)}
if (b_type){document.write(qmap1+cdd__codebase+"pbrowser_"+b_type+qmap2);document.close();}
Ділись своїми роботами та отримуй миттєві бонуси!
0%
Оголошення від адміністратора