זה JavaScript קוד יעביר מחרוזת טקסט יחידה המכילה כל טקסט שתבחר דרך חלל מרפק אופקי ללא הפסקות. זה עושה זאת על ידי הוספת עותק של מחרוזת הטקסט לתחילת הגלילה ברגע שהיא נעלמת מסוף שטח המרחב. התסריט מגלה אוטומטית כמה עותקים של התוכן שהוא צריך ליצור כדי להבטיח שלעולם לא ייגמר לך הטקסט במארז שלך.
זה כולל את הקוד מהדוגמאות שלי, שמוסיף שני אובייקטים mq חדשים המכילים את המידע על הצגתם בשני המרזבים. אתה יכול למחוק אחד כזה ולשנות את השני כדי להציג מסר אחד רציף בדף שלך או לחזור על הצהרות אלה כדי להוסיף עוד סימונים. יש לקרוא לפונקציה mqRotate מעבר mqr לאחר הגדרת המארקים ככזו שתטפל בסיבובים.
// מרקם טקסט רציף
// זכויות יוצרים 30 בספטמבר 2009 מאת סטיבן צ'פמן
// http://javascript.about.com
// ניתנת הרשאה להשתמש ב- Javascript זה בדף האינטרנט שלך
// בתנאי שכל הקוד להלן בסקריפט זה (כולל אלה
// הערות) משמש ללא כל שינוי
פונקציה objWidth (obj) {if (obj.offsetWidth) להחזיר obj.offsetWidth;
אם (obj.clip) יחזיר obj.clip.width; להחזיר 0;} var mqr = []; פונקציה
mq (id) {this.mqo = document.getElementById (id); var wid =
objWidth (this.mqo.getElementsByTagName ('span') [0]) + 5; var מלא =
objWidth (this.mqo); var txt =
this.mqo.getElementsByTagName ('span') [0] .innerHTML; this.mqo.innerHTML
= ''; var heit = this.mqo.style.height; this.mqo.onmouseout = פונקציה ()
{mqRotate (mqr);}; this.mqo.onmouseover = פונקציה ()
{clearTimeout (mqr [0] .TO);}; this.mqo.ary = []; var maxw =
Math.ceil (מלא / רחבה) +1; עבור (var i = 0; i <
maxw; i ++) {this.mqo.ary [i] = document.createElement ('div');
this.mqo.ary [i] .innerHTML = txt; this.mqo.ary [i] .style.position =
'מוחלט'; this.mqo.ary [i] .style.left = (wid * i) + 'px';
this.mqo.ary [i] .style.width = wid + 'px'; this.mqo.ary [i] .style.height =
היל; this.mqo.appendChild (this.mqo.ary [i]);} mqr.push (this.mqo);}
פונקציה mqRotate (mqr) {אם (! mqr) להחזיר; עבור (var j = mqr.length - 1; j
> -1; j--) {maxa = mqr [j] .ary.length; עבור (var i = 0; imqr [j] .ary [i] .style; x.left = (parseInt (x.left, 10) -1) + 'px';} var y =
mqr [j] .ary [0] .style; אם (parseInt (y.left, 10) + parseInt (y.width, 10) <0)
{var z = mqr [j] .ary.shift (); z.style.left = (parseInt (z.style.left) +
parseInt (z.style.width) * מקסימום) + 'px'; mqr [j] .ary.push (z);}}
mqr [0] .TO = setTimeout ('mqRotate (mqr)', 10);}
תוכן הטקסט בפועל עבור המסדרון נכנס לחלוקה בתגית טווח. הרוחב של תג הטווח הוא זה שישמש כרוחב כל איטרציה של התוכן בסולם המסך (בתוספת 5 פיקסלים רק כדי לרווח אותם זה מזה).
לבסוף, וודא שקוד ה- JavaScript שלך להוספת אובייקט ה- mq לאחר טעינת העמוד מכיל את הערכים הנכונים.
כדי להוסיף מארקים נוספים, באפשרותך להגדיר חלוקות נוספות ב- HTML, ולתת לכל תוכן תוכן משלו בתוך טווח; הגדר שיעורים נוספים אם ברצונך לעצב את המארקים בצורה אחרת; ולהוסיף כמה שיותר הצהרות mq () חדשות שיש לך סימני צבע. וודא כי קריאת ה- mqRotate () עוקבת אחריהם כדי להפעיל עבורנו את המרזבים.