هذه جافا سكريبت سينقل الكود سلسلة نصية واحدة تحتوي على أي نص تختاره من خلال مساحة سرادق أفقية بدون فواصل. تقوم بذلك عن طريق إضافة نسخة من السلسلة النصية إلى بداية التمرير بمجرد اختفائها من نهاية مساحة التحديد. يعمل البرنامج النصي تلقائيًا على تحديد عدد نسخ المحتوى التي يحتاج إلى إنشائها لضمان عدم نفاد النص الموجود في مستطيل التحديد.
يتضمن هذا الرمز من الأمثلة الخاصة بي ، والذي يضيف كائنين mq جديدين يحتويان على معلومات حول ما يتم عرضه في هذين المستطيلين. يمكنك حذف واحد من هؤلاء وتغيير الآخر لعرض مستطيل واحد مستمر على صفحتك أو تكرار هذه العبارات لإضافة المزيد من المستطيلات. يجب أن تسمى وظيفة mqRotate بالمرور mqr بعد أن يتم تعريف المستطيلات لأنها ستتعامل مع التدوير.
// النص المستمر سرادق
// حقوق الطبع والنشر 30 سبتمبر 2009 by ستيفن تشابمان
// http://javascript.about.com
يتم منح / / إذن لاستخدام Javascript على صفحة الويب الخاصة بك
// شريطة أن تكون جميع الشفرات أدناه في هذا البرنامج النصي (بما في ذلك هذه
// التعليقات) يستخدم دون أي تغيير
دالة objWidth (obj) {if (obj.offsetWidth) بإرجاع obj.offsetWidth؛
إذا كان (obj.clip) بإرجاع obj.clip.width؛ return 0؛} var mqr = []؛ وظيفة
mq (id) {this.mqo = document.getElementById (id)؛ فار wid =
objWidth (this.mqo.getElementsByTagName ('span') [0]) + 5؛ فار فولويد =
objWidth (this.mqo) ؛ فار النص =
this.mqo.getElementsByTagName ('span') [0] .innerHTML؛ this.mqo.innerHTML
= ''; var heit = this.mqo.style.height؛ this.mqo.onmouseout = function ()
{mqRotate (mqr)؛}؛ this.mqo.onmouseover = function ()
{clearTimeout (mqr [0] .TO)؛}؛ this.mqo.ary = [] ؛ فار maxw =
Math.ceil (fulwid / wid) +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) {if (! mqr) بإرجاع؛ لـ (var j = mqr.length - 1؛ ي
> -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؛ if (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) * maxa) + 'px'؛ mqr [j] .ary.push (z)؛}}
mqr [0] .TO = setTimeout ('mqRotate (mqr)'، 10)؛}
ينتقل محتوى النص الفعلي للسرادق داخل div في علامة span. عرض علامة الامتداد هو ما سيتم استخدامه كعرض لكل تكرار للمحتوى الموجود في المستطيل (بالإضافة إلى 5 بيكسل فقط لإبعادهم عن بعضهم البعض).
أخيرًا ، تأكد من أن شفرة JavaScript الخاصة بك لإضافة كائن mq بعد تحميل الصفحة تحتوي على القيم الصحيحة.
لإضافة عناصر إضافية ، يمكنك إعداد div إضافية في HTML ، مع إعطاء كل محتوى نصي خاص بها داخل نطاق ؛ إعداد فصول إضافية إذا كنت تريد تصميم المستطيلات بطريقة مختلفة ؛ وأضف أكبر عدد ممكن من عبارات mq () الجديدة التي لديك بها خامات. تأكد من أن استدعاء mqRotate () يتبعهم لتشغيل الخيام بالنسبة لنا.