Պատուհանը տարրին ոլորելու մեթոդը JavaScript-ում

scrollIntoView մեթոդը ոլորում է պատուհանը տվյալ տարրին: Մեթոդը կիրառվում է այն տարրի նկատմամբ, որին պետք է ոլորել պատուհանը: Մեթոդի պարամետրով կարգավորվում է, թե որտեղ պետք է հայտնվի տարրը՝ պատուհանի վերևում, թե ներքևում:

Դիտարկենք օրինակներով: Եկեք ոլորենք պատուհանն այնպես, որ տարրը լինի պատուհանի վերևում.

javascriptelem.scrollIntoView(true);

Իսկ այժմ եկեք ոլորենք պատուհանն այնպես, որ տարրը լինի պատուհանի ներքևում.

javascriptelem.scrollIntoView(false);

Կարելի է նաև պարամետրով փոխանցել օբյեկտ կարգավորումներով: Եկեք հարթ ոլորենք պատուհանը դեպի տարրը.

javascriptelem.scrollIntoView({
  behavior: 'smooth',
});

Կարգավորումներով օբյեկտը ունի նաև էջի հավասարեցման կարգավորումներ տարրի նկատմամբ: block կարգավորումը սահմանում է ուղղահայաց հավասարեցում, իսկ inline կարգավորումը՝ հորիզոնական: Դրանք կարող են ընդունել հետևյալ արժեքները. 'start', 'center', 'end', 'nearest':

Փորձենք.

javascriptelem.scrollIntoView({
  behavior: 'smooth',
  block: 'start',
  inline: 'end',
});
Задание 1

Տրված է տարր և կոճակ: Կոճակի վրա սեղմելիս ոլորեք էջը դեպի տվյալ տարրը: Փորձարկեք բոլոր նկարագրված հնարավորությունները: