Подякувати Студентському архіву довільною сумою
Admin
26.02.2023 12:38
Дякуємо, що користуєтесь нашим архівом!
Бібліотека jQuery
Інформація про навчальний заклад
ВУЗ:
Національний університет Львівська політехніка
Інститут:
ІКТА
Факультет:
Комп'ютерна інженерія
Кафедра:
ЕОМ
Інформація про роботу
Рік:
2015
Тип роботи:
Лабораторна робота
Предмет:
Глобальні інформаційні мережі
Група:
КІ 43
Частина тексту файла (без зображень, графіків і формул):
Міністерство освіти і науки, молоді та спорту України
Національний університет «Львівська політехніка»
Кафедра ЕОМ
/
Лабораторна робота №4
з предмету:
«Глобальні інформаційні мережі»
на тему:
« Бібліотека jQuery »
Львів – 2015
Мета роботи: Ознайомитися з бібліотеками jQuery та jQuery UI та реалізованими прикладами. Втілити обрані скрипти jQuery UI (слайдер, випадне меню, галерея тощо) у відповідні сторінки сайту.
Порядок роботи:
Ознайомитися з наведеними ресурсами.
Ознайомитися з бібліотеками jQuery та jQuery UI та реалізованими прикладами.
Втілити обрані скрипти jQuery UI (слайдер, випадне меню, галерея тощо) у відповідні сторінки сайту.
Обрати кілька віджетів та інформерів з відкритих джерел.
Втілити їх у відповідні сторінки сайту.
Розглянути код скрипта і якщо це можливо змінити розміри, колір шрифту для стильової сумісності дизайну.
Хід роботи:
Додаю на свій сайт два вірджети, перший – інформаційник погоди, а другий – он-лайн телебачення.
Вірджет №1: погодник
<style>
#IUAweather {min-width: 120px; width: 240px; cursor: pointer;}
#IUAweather * {margin: 0; padding: 0;}#IUAweather .content {overflow: hidden; padding: 4px; font-family: Arial; font-size: 10px; color: #000000; background: #EEEEEE; border: 1px solid #00529c;}
#IUAweather h1 {overflow: hidden; margin-top: -4px; font-size: 12px; font-weight: bold; height: 20px; line-height: 20px; color: #006600;}
#IUAweather h1 span {float: left; white-space: nowrap;}
#IUAweather h1 i {float: right; display: inline-block; width: 36px; height: 15px; background: url(http://i3.i.ua/v2/logo/logo_small_14_black.png) no-repeat 0 1px transparent; opacity: .3;}
#IUAweather a, #IUAweather a:hover {border: none; text-decoration: underline; color: #006600;}
#IUAweather dl {overflow: hidden; background: #CCCCCC; color:#000000; padding: 4px; margin-bottom: 4px;}
#IUAweather dl dt {font-weight: bold; font-size: 12px;}
#IUAweather dl dd {float: left; white-space: nowrap; width: 50%; min-width: 105px;}
#IUAweather dl dd span {display: block; line-height: 24px; font-size: 20px; font-family: Trebuchet MS;}#IUAweather dl dd span img {vertical-align: top; margin-right: 2px;}
</style>
<div id="IUAweather" onclick="window.location.href='http://weather.i.ua/Lvov/';">
<div class="content" id="IUAweatherBody">
<h1 id="IUAweatherTitle"><span><a href="http://weather.i.ua/Lvov/" id="IUAweatherTitleLink">Погода</a></span><i></i></h1>
<dl id="IUAweatherEmbed"></dl><a href="http://weather.i.ua/Lvov/" id="IUAweatherLink">Прогноз погоди на тиждень</a>
</div>
</div>
<script type="text/javascript">
iWeatherCity = 11301;
iWeatherLang = 2;
iWeatherEnc = 0;
</script>
<script src="http://i3.i.ua/js/i/weather_informer.js" type="text/javascript" charset="windows-1251"></script>
Вірджет №2 – он-лайн телебачення:
<iframe scrolling="no" frameborder="0" src="http://tvforsite.ru/onlinetv.php?playerid=60186" width="640px" height="393px"> Your browser doesn not support floating frames! </iframe>
/
Рис.1 Сайт після додавання віджетів..
/
Рис.2 Робота скрипту jQuery на сайті
Висновок: На цій лабораторній роботі я ознайомився з бібліотеками jQuery та jQuery UI.
Ділись своїми роботами та отримуй миттєві бонуси!
0%
Оголошення від адміністратора