Содержание
jQuery — это новый вид библиотеки JavaScript . Это быстрая и лаконичная библиотека JavaScript, которая упрощает обход документов HTML, обработку событий, анимацию и взаимодействие Ajax для быстрой веб-разработки . JQuery разработан, чтобы изменить способ написания JavaScript.
Использование jQuery library растет и растет (только что выпустил jQuery 3.3.1), все больше и больше людей используют эту полезную библиотеку javascript.
Это означает, что все больше и больше полезных советов, приемов и решений jQuery будут доступны. Вот почему я создал небольшой список из 5 интересных и полезных jQuery советов, приемов и решений.
Jquery уроки помогут вам узнать основные черты последней JQuery рамки , от простых до сложных вопросов шаг за шагом , так что вы можете создавать интерактивные и потрясающие веб — страничек с гораздо меньшими усилиями.
В jQuery есть много очень полезных плагинов, которые могут помочь вам практически с чем угодно, но есть пара плагинов, которые не настолько умны в использовании, почему?
Ну, иногда 1 или 2 строки кода jQuery могут делать то же самое (или даже лучше), так зачем использовать большой скрипт, если вы можете сделать тот же трюк с небольшим фрагментом кода .
1) Предварительная загрузка изображений
|
1
2
3
4
5
6
7
8
9
|
$ ( документ ) . готов ( функция ( ) {
JQuery . preloadImages знак равно функция ( ) {
за ( вар я знак равно 0 ; я ) .attr (
ЦСИ , аргументы [i]);
}
}
// как пользоваться
$ .preloadImages ( image1 . jpg ) ;
} ) ;
|
2) Отключить щелчок правой кнопкой мыши
|
1
2
3
4
5
|
$ ( документ ) . готов ( функция ( ) {
$ ( документ ) . bind ( contextmenu , функция ( е ) {
вернуть ложь ;
} ) ;
} ) ;
|
3) CSS Style Switcher
|
1
2
3
4
5
6
7
8
9
10
11
|
$ ( документ ) . готов ( функция ( ) {
$ ( a.Styleswitcher ) . нажмите ( функция ( ) {
// переключаем атрибут LINK REL со значением в атрибуте A REL
$ ( 'link [rel = stylesheet]' ) . attr ( 'href' , $ ( это ) . attr ( 'rel' ) ) ;
} ) ;
// как пользоваться
// поместите это в свой заголовок — ссылки
По умолчанию тема
Красная тема
Голубая тема
} ) ;
|
4) Гладкая (анимированная) прокрутка страницы
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
$ ( документ ) . готов ( функция ( ) {
$ ( 'a [href * = #]' ) . нажмите ( функция ( ) {
если ( местоположение . путь . заменить ( / ^ / / , '' ) == это. путь к файлу. заменить ( / ^ / / , '' ) &&
location.hostname == this.hostname) {
var $ target = $ (this.hash);
$ target знак равно $ target . длина && $ target ||
$ ('[name =' + this.hash.slice (1) + ']');
если ( $ target . length ) {
вар targetOffset знак равно $ target . смещение ( ) . верх ;
$ ( 'html, body' )
, одушевленный ( {
scrollTop : targetOffset
} , 900 ) ;
вернуть ложь ;
}
}
} ) ;
// как пользоваться
// Поместите это туда, где вы хотите прокрутить — ссылка
перейти к Топ
} ) ;
|
5) Получить курсор мыши по осям X и Y
|
1
2
3
4
5
6
|
$ ( документ ) . готов ( функция ( ) {
$ ( ) . перемещение мыши ( функция ( е ) {
// отображаем значения оси x и y внутри div с идентификатором XY
$ ( '#XY' ) . html ( Ось X: + эл . pageX + | Ось Y + эл . pageY ) ;
} ) ;
} ) ;
|
Нажмите здесь, чтобы получить всю подробную информацию: http://api.jquery.com/
0.00 (0%) 0 votes
