גלילה מאפשרת למשתמשים להציג את דפי האינטרנט/מסמכים הארוכים שמאלה וימינה או למעלה ולמטה. ניתן לבצע זאת על ידי הוספת פסי גלילה אופקיים ואנכיים בהתאם לתוכן. המידות של פס הגלילה כגון הגובה והרוחב מוגדרות כברירת מחדל. עם זאת, ניתן להתאים אותם בעזרת שיטות ה-JavaScript המשויכות להם. ברגע שניתן להוסיף אותם או להגדיר אותם במסמך, המשתמש יכול לזהות אותם בקלות באמצעות ' scrollTop() ', וה ' scrollLeft() ' שיטות.
פוסט זה מסביר את המטרה והפונקציונליות של שיטת 'scrollLeft()' ב-jQuery.
מהי שיטת 'scrollLeft()' ב-jQuery?
ה ' scrollLeft() השיטה תוכננה במיוחד עבור פס הגלילה האופקי כדי להגדיר ולאחזר את מיקומו בפיקסלים. הוא מחשב את מיקום פס הגלילה של רכיב HTML שנבחר. הוא מוחל בעיקר על רכיבי ה-div, המיכל והקטע.
תחביר (הגדר מיקום פס גלילה אופקי)
$ ( בוחר ) .scrollLeft ( עמדה )
התחביר לעיל לוקח את הערך השלם בתור שלו ' עמדה ' ארגומנט להגדרת מיקום פס הגלילה האופקי של הבורר הממוקד.
תחביר (קבל מיקום פס גלילה אופקי)
$ ( בוחר ) .scrollLeft ( )
תחביר זה מחזיר את ערך הארגומנט 'מיקום' של הבורר בפיקסלים.
בואו נשתמש בשיטה המוגדרת באופן מעשי.
קוד HTML
ראשית, עיין בקוד ה-HTML המוצהר:
< סָעִיף סִגְנוֹן = 'גובה:150px; רוחב: 200px ;margin:auto;border:2px שחור מלא; גלישה: אוטומטי;רווח לבן: nowrap;' >
< h2 > ברוכים הבאים ל-Linuxhint ! h2 >
סָעִיף >
< לַחְצָן > הגדר מיקום לַחְצָן >
בשורות הקוד לעיל:
- ה ' <קטע> תג ' מכיל קטע בתוך מסמך ה-HTML המותאם אישית בעזרת התכונה 'סגנון'.
- בתוך החלק שנוצר, ' ' תג מגדיר את כותרת המשנה.
- לבסוף, ה' <כפתור> ' תג מוסיף כפתור.
הערה: עקוב אחר קוד ה-HTML הנתון בכל הדוגמאות של פוסט זה.
דוגמה 1: החלת שיטת 'scrollLeft()' כדי להגדיר את מיקום סרגל הגלילה (אופקי)
דוגמה זו משתמשת בשיטת 'scrollLeft()' כדי להגדיר את סרגל הגלילה (אופקי) במיקום שצוין.
קוד jQuery
עקוב אחר קוד jQuery הנתון:
< תַסרִיט src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js' > תַסרִיט >< תַסרִיט >
$ ( מסמך ) .מוּכָן ( פוּנקצִיָה ( ) {
$ ( 'לַחְצָן' ) .נְקִישָׁה ( פוּנקצִיָה ( ) {
$ ( 'סָעִיף' ) .scrollLeft ( חמישים ) ;
} ) ;
} ) ;
תַסרִיט >
בקטע הקוד הזה:
- ראשית, ציין את נתיב ה-CDN של ספריית jQuery ב-'