JavaScript
Подписаться на эту рубрику по RSS
JavaScript. SWITCH
Четверг, 15 сентября 2011 г.Рубрика: JavaScript -> Условия
Метки: case | javascript | js | switch
Просмотров: 325
Подписаться на комментарии по RSS
Оператор switch позволяет делать определённые действия в зависимости от получаемых данных.
switch(time){
case 1:
действия
break;
case 2:
действия
break;
default: действия, если нет подходящих вариантов
}Работает эта конструкция так:
Шкала времени
Четверг, 18 августа 2011 г.Рубрика: Учебник CSS -> PHP программирование -> JavaScript -> Готовые решения
Метки: css | javascript | jquery | js | php | временная | время | шкала
Просмотров: 462
Подписаться на комментарии по RSS
Давайте создадим прекрасную временную шкалу, похожую на такую же шкалу Google, которую создали к юбилею (10 лет). ( http://www.google.com/tenthbirthday/).
Временная шкала воспользуется PHP, MySQL, CSS и jQuery,
они, конечно же, предадут ей замечательный вид, и поддержат её, когда она будет разворачивать дополнительную информацию о событии при нажатии кнопки мауса.
Прибавка нового события, простая вставка новой строчки в таблицу для информации.
Действие первое. - XHTML.
Создадим структуру XHTML. (Файл demo.php)
<div id="timelineLimiter"> <!-- Скрывает выступающие div timelineScroll --> <div id="timelineScroll"> <!-- Содержит временную шкалу и расширяет ее для заполненияы --> <!-- PHP код, который генерирует список событий --> <div class="clear"></div> </div> <div id="scroll"> <!-- Год временной шкалы --> <div id="centered"> <!-- Размер устанавливается jQuery для запооленеия всех лет --> <div id="highlight"></div> <!-- Светлоголубая полоска позади надписей с годами --> <?=$scrollPoints?> <!-- Данная переменная PHP сожержит года, которые имеют события --> <div class="clear"></div> </div> </div> <div id="slider"> <!-- Контейнер слайдера --> <div id="bar"> <!-- Полоска, которую можно перетаскивать мышкой --> <div id="barLeft"></div> <!-- Левая стрелка на полоске --> <div id="barRight"></div> <!-- Правая стрелка на полоске, обе стилизованы с помощью CSS --> </div> </div> </div>
Стиль сайта в соответствии с погодой
Вторник, 16 августа 2011 г.Рубрика: JavaScript -> Учебник CSS
Метки: css | javascript | jquery | js | погода | сайт | стиль
Просмотров: 272
Подписаться на комментарии по RSS
При помощи Yahoo API и jQuery возможно поменять вид сайта в зависимости от того, какая температура воздуха на улице! В данном уроке вы узнаете, как это сделать.
Начните с того что создайте четыре фона для погоды (солнечная, дождливая, облачная, снежная ). Потом, при помощи скрипта jQuery
«закинем» прогноз погоды. И в заключении, изготовим управление темой (ручное), с помощь которого пользователь сам выберет что захочет.
Создание темы.
Создадим четыре изображения в крупном масштабе. Шаблон для всех рисунков один и тот же. Но, каждый подогнанный под определённую погоду.
Получаем сведения о погоде
$(document).ready(function() {
$.YQL = function(query,
callback) {
var encodedQuery =
encodeURIComponent(query.toLowerCase()),
url =
'http://query.yahooapis.com/v1/public/yql?q=' +
encodedQuery
+
'&format=json&callback=?';
$.getJSON(url, callback);
};
$.YQL("select * from rss
where url='http://weather.yahooapis.com/forecastrss?p=UKXX0133'",function(data){
var w =
data.query.results.item;
var class =
w.condition.text;
var encodedclass =
class.replace(/\s+/g, '-').toLowerCase();
$('body').addClass(encodedclass);
});
});
Функции
Воскресенье, 14 августа 2011 г.Рубрика: JavaScript -> Функции
Метки: function | javascript | js | функции
Просмотров: 260
Подписаться на комментарии по RSS
Сегодня мы с Вами поговорим о функциях.
Функции используются почти во всех языках программирования.
Давайте попробуем понять что это такое:
Представьте что Вам нужно сходить в магазин за деталями к машине, но Вы не знаете где находится такой магазин, и тогда тот, кто Вас попросил сходить в магазин написал Вам на бумаге инструкцию как добраться к магазину с запчастями.
Скажем там было написано - дойди до главной площади, поверни на лево и дойди до магазина мебели, после поверни на право, и пройди 500 метров до перекрёстка, потом поверни на лево и иди прямо, на правой стороне увидишь вход в переулок, войди в него и там с права будет стоять этот магазин.
По этой инструкции Вы дойдёте до магазина и купите запчасти.
И завтра Вас опять попросят сходить за запчастями, и Вы уже имея инструкцию дойдёте до магазина, не спрашивая у другого человека где это находится.
Получается инструкция на бумажке - это функция, по которой Вы можете выполнить определённое действие.
И называется эта функция - запчасти.
В программировании - в функцию Вы можете поместить какие-то действия, например - спросить у пользователя пароль, занести ответ в переменную и обработать.
Методы объекта window
Воскресенье, 14 августа 2011 г.Рубрика: JavaScript -> Объект window
Метки: alert | confirm | prompt | window | методы | объект
Просмотров: 332
Подписаться на комментарии по RSS
И так, мы дошли до методов объекта window.
Как мы знаем есть объект document, который позволяет управлять содержимым страницы.
Кроме самого сайта в браузере ещё много чего.
При помощи этого объекта можно получить информацию о браузере пользователя, его разрешении экрана и т.д.
Например объект hostory, позволяет просмотреть историю пользователя, например - с какой страницы он пришёл.
Или объект screen - содержит информацию о экране пользователя.
Объект window является родителем всех остальных объектов.
И так рассмотрим первый метод объекта window - метод open ().
Этот метод позваляет нам открывать новое окно браузера.
Этому методу передаются три параметра - тип окна, имя окна, параметры окна ( такие как размер... ).
Мы создадим простое окно размером 500 на 500 под именем Новое JS окно.

