Categories » CSS

css-lessons

CODING, jQuery, Slick Js, Tooltip

Вёрстка HomeWork *

jQuery 1.9.1

page2page

jQuery UI

Tooltipster

Slick Js (get it now)

Вся работа с jQuery ведётся с помощью функции $. Можно использовать и полное название jQery.

$(…);

Главное научиться правильно обращаться к элементам (также как и в css), например:

$(‘.first’); — обращение к классу first

аналогичная инструкция на JavaScript:

document.getElementsByClassName(‘first’); — обращение к классу

document.getElementById(id); — обращение к id (#)

$(‘p’);

document.getElementsByTagName(‘p’); — аналог выборки тэгов ‘p’

Библиотеки скриптов можно подключить в конце тега <body>, первым из которых должен быть jQuery (только в том случае, если не используется обработчик события)

$(‘table tr:even’).css(‘background’, «red»); — окраска нечётных строчек в таблице красным цветом

$(document).ready(function(){}); — когда документ загрузится выполнить функцию

например:

$(document).ready(function(){
$(‘table tr:even’).css(‘background’, «red»);
}); — только в этом случае скрипты можно подключить в заголовке, таким образом отработает скрипт по окраске нечётных строк нашей таблицы

$(‘.btn-slide’).click(function(){
$(‘.panel’).hide();
}); — скроет панель с классом .panel при клике на кнопку с классом .btn-slide

var panel = $(‘.panel’); — создание объекта panel из класса .panel

$(‘.btn-slide’).click(function(){
if(panel.is(‘:hidden’)){ — если панель скрыта
panel.show(); — показать её
} else { — в любом другом случае
panel.hide(); — скрыть панель
}
});

пример с классом из нескольких элементов:

$(‘.set a’).click(function(){ — событие клика на класс set элемент а
if($(this).hasClass(‘active’)) { — если один из элементов выбран и он активен, тогда выполнить следующие команды
$(this).removeClass(‘active’); — удаляем класс active
$(this).siblings(‘.content’).show(); — показываем родственный класс content (который лежит на том же уровне)
} else{ — в другом случае
$(‘.set a’).removeClass(‘active’);
— удаляем все классы active
$(this).addClass(‘active’);
— добавляем класс active тому элементу который выбран в данный момент (по которому был произведен клик)
$(‘.content’).hide();
— прячем весь класс content
$(this).siblings(‘.content’).show();
— показываем только тот класс content по которому был клик
}

});

Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages
Filter by Categories
=) Home Work
CSS
JavaScript
Word Press

Интеркасса (API)

Доллар

покупка  $ 1 | 27.53 грн
продажа $ 1 | 24.7 грн

Евро

покупка  € 1 | 30.59 грн
продажа € 1 | 27.33 грн