Міністерство освіти і науки, молоді та спорту України Національний університет «Львівська політехніка» Кафедра ЕОМ / Лабораторна робота №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.