خلق المتزلج دائري الآلي بناء على تسمية

  هذه المرة وسوف نناقش كيفية جعل دائري المنزلق التسمية تلقائيا بناء. مبدأ عمل المنزلق هو نفس المنزلق التلقائي استنادا إلى فئات . كنت مجرد استبدال التسمية الخاص بك وسوف المنزلق تعمل وفقا للتسمية التي قمت بإدخالها. دائري المنزلق الذي أدليت به هذه المرة بسيطة جدا ومجرد استخدام البرنامج النصي دون إضافة تأثيرات تخفيف jCarousellite وعجلة الماوس.

DEMO

Pemasangannyapun طريقة سهلة جدا، إذا كنت اتدرب مقالتي السابقة بعنوان لجعل شريط التمرير تلقائيا بناء على فئات محددة ، وكان هذا البرنامج التعليمي من السهل جدا، وذلك لأن الخطوات هي نفسها تقريبا تصنيع. أدناه على الفور خطوات لجعل ذلك:

1. الدخول إلى Blogger باستخدام حسابك
2. بعد أن حدد بلوق كنت ترغب في إضافة هذا المنزلق.
3. الذهاب إلى >> تحرير قالب HTML، ثم تحقق توسيع قوالب القطعة
4. وكإجراء وقائي لتجنب الأخطاء في تحرير المستقبل، أولا احتياطية القالب الخاص بك.
5. بعد كل الخطوات أعلاه قمت بذلك، وضع التعليمات البرمجية التالية فوق رمز]]> </ B: الجلد>:
   
   # دائري {عرض: 950 بكسل، الطول: 185 بكسل؛ هامش القاع: 0PX؛ الموقف: النسبية؛ العرض: كتلة}
   # كاروسيل كرر وسط}
   # كاروسيل مركز؛ مؤشر ض: 100؛ المؤشر: المؤشر؛ الحدود اليمين: 1px الصلبة # CCC}
   # كاروسيل مركز}
   # كاروسيل مركز؛ مؤشر ض: 100؛ المؤشر: المؤشر؛ الحدود اليسار: 1px الصلبة # CCC}
   # كاروسيل مركز}
   # دائري UL {عرض: 100000px؛ الموقف: النسبية؛ هامش قمة: 10px}
   # دائري UL لى {خلفية: # الاتحاد الفرنسي رابط (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOi0shBcNrh38RtKwb3Ggr3_jgoScYcc-yfDKxpkeN55rNkM0i_FrZpjt7e-7Mhn_UPNsV9lene3AMSJPqXXoKQ95IJncquqckohw5wd3U8zWtvSNuuKovM0n_7N3oRgoT6UN0Dzg5Nmg/s1600/main.png) كرر-X الصلبة # CCC، العرض: 145px؛ الطول: 150px؛ الهامش: 0 4PX 7PX 20px؛ الحشو: 6PX؛-بكت الحدود راديوس: 4PX؛-MOZ الحدود راديوس: 4PX؛ حد راديوس: 4PX؛}
   # دائري ماي لي: تحوم {فلتر: ألفا (عتامة = 75)؛ التعتيم: .75؛}
   A.slider_title # دائري UL لى {لون: # 222؛ العرض: كتلة؛ هامش قمة: 5PX}
   A.slider_title # دائري ماي لي: تحوم {لون: # cd1713}
   # دائري لIMG {عرض: كتلة؛ الخلفية: # الاتحاد الفرنسي؛ هامش قمة: 0}
   ملاحظة رمز الأزرق أعلاه، هو عرض وارتفاع المنزلق على التجريبي الذي أدليت به، يمكنك ببساطة ضبط حجم القالب الخاص بك.
6. والخطوة التالية هي لوضع تحرير HTML، إدراج التعليمة البرمجية التالية فوق رمز </ HEAD>:
   
   <script src=' type='text/javascript'/> http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'
   <script src='http://yourjavascript.com/265232511102/carousellite.js' type='text/javascript'/>
   
   <script type='text/javascript'>
   / / <! [CDATA [
   imgr = مجموعة جديدة ()؛
   imgr [0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzNUpphY-uMnxXO5aA9CsaUquuKtlv6MG7bFkpYrgA9XCC7Oy_ToHkJYi0D8lvXmvKTiJ2xSeVsDtYZF2r1oAAERbTSKbZ5nr2JnDRHkfYDxOrl5NPjfuhp9ZW7mgxL77CGYNIQAXb2aY/s1600/no+image.jpg"؛
   showRandomImg = صحيح؛
   
   aBold = صحيح؛
   
   summaryPost = 140؛
   summaryTitle = 25؛
   
   numposts1 = 15؛
   label1 = "الأخبار"؛
   
   removeHtmlTag وظيفة (strx، ختم) {
   فار ق = strx.split ("<")؛
   ل(فار ط = 0، وأنا <s.length، وأنا + +) {
   إذا كان (ق [أنا]. indexOf (">")! = -1) {
   و [أنا] = ق [أنا] فرعية (ق [أنا] indexOf (">") +1، و [أنا] طول.)؛
   }
   }
   
   S = s.join ("")؛
   S = s.substring (0، ختم-1)؛
   عودة ثانية؛
   }
   showrecentposts وظيفة (سلمان) {
   ي = (showRandomImg)؟ Math.floor ((imgr.length +1) * Math.random ()): 0؛
   IMG = مجموعة جديدة ()؛
   document.write ('<UL>')؛
   ل(فار ط = 0، وأنا <numposts1، وأنا + +) {
   فار دخول = json.feed.entry [أنا]؛
   posttitle فار = entry.title $ T؛
   فار PCM؛
   فار posturl؛
   إذا كان (ط == json.feed.entry.length) كسر؛
   ل(VAR K = 0؛ ك <entry.link.length؛ K + +) {
   إذا كان (entry.link [ك]. يختلط == 'البديل') {
   posturl = entry.link [ك] أ href.؛
   كسر؛
   }
   }
   
   ل(VAR K = 0؛ ك <entry.link.length؛ K + +) {
   إذا كان (entry.link [ك]. يختلط == && 'رد' entry.link [ك]. نوع == 'نص / HTML') {
   PCM = entry.link [ك] title.split ("") [0]؛
   كسر؛
   }
   }
   
   إذا كان ("المحتوى" في الدخول) {
   . postcontent فار = entry.content $ T؛}
   آخر
   إذا كان ("الملخص" في الدخول) {
   . postcontent فار = entry.summary $ T؛}
   postcontent آخر فار = ""؛
   أخر التاريخ = entry.published $ T؛
   إذا (ي> imgr.length-1) ي = 0؛
   IMG [أنا] = imgr [ي]؛
   S = postcontent: A = s.indexOf ("<IMG")، ب = s.indexOf ("SRC = \" "، أ)؛ ج = s.indexOf (" \ ""، ب +5) D = s.substr (ب +5، CB-5)؛
   إذا كان ((a! = -1) && (b! = -1) && (c! = -1) && (d! = "")) IMG [أنا] = D؛
   / / Cmtext = (text! = 'لا')؟ '<I> <font Color="'+acolor+'"> (' + PCM +'' + نص + ') </ FONT> </ I>':''؛
   فار الشهر = [1،2،3،4،5،6،7،8،9،10،11،12]؛
   month2 فار = ["وجهات النظر"، "فبراير"، "مارس"، "ابريل"، "مايو"، "يونيو"، "يوليو"، "أغسطس"، "ايلول"، "أكتوبر"، "نوفمبر"، "ديسمبر "]؛
   . فار يوم = postdate.split ("-") [2] سلسلة فرعية (0،2)؛
   فار م = postdate.split ("-") [1]؛
   فار Y = postdate.split ("-") [0]؛
   ل(VAR V2 = 0؛ U2 <month.length؛ U2 + +) {
   إذا كان (parseInt (م) == الشهر [U2]) {
   م = month2 [U2]؛ كسر؛
   }
   }
   
   daystr فار = اليوم +'' +'' + M + Y؛
   trtd فار = '<DIV <li class="car"> الطبقة = "الإبهام"> <a href="'+posturl+'"> <عرض IMG = "145" ذروة = فئة "100" = "alignnone" SRC = "'+ IMG [أنا] +" /> </ A> </ div> <فئة <p> و= "slider_title" أ href = "' + posturl + '">' posttitle + + '</ A> </ P > </ لى> '؛

   
   document.write (trtd)؛
   J + +؛
   }
   document.write ('</ UL>')؛
   }
   / /]]>
   </ SCRIPT>
   الوصف:
   
   لاحظ URL بالخط الأحمر أعلاه، هو الاحدث في سلسلة jquery.min.js التعليمات البرمجية النصية التي يمكنني استخدامها لجعل هذا المنزلق. إذا وترد بالفعل كنت في Query.min.js ي قالب على الرغم من سلسلة مختلفة، رمز اللون الأحمر أعلاه لم تعد في حاجة للدخول. فقط واحدة jquery.min.js القائمة القالب، والأمر متروك الرقم المسلسل، إذا كان ذلك ممكنا أحدث إصدار.
   في حين أن رمز اللون الأزرق: 15 هو عدد المنزلق عرض. ويتم عرض الأخبار على التسمية المنزلق في وقت لاحق (تذكر يجب أن تكون الرسالة الصغيرة كبيرة نفس التسمية التي قمت بإنشائها).
7. والخطوة التالية هي لاستدعاء التمرير لتظهر على بلوق. البحث <div id='main-wrapper'>، ثم ضع التعليمات البرمجية التالية على ذلك:
   <b:if cond='data:blog.pageType != "item"'>
   <div id='carousel'>
   <div id='previous_button'/>
   <div class='container'>
   <SCRIPT>
   

   document.write ('<النصي

   </ SCRIPT>
   <div class='clear'/>
   </ div>
   <div id='next_button'/>
   </ div>
   <script type='text/javascript'>
   (وظيفة ($) {$ (وثيقة). جاهز (وظيفة () {
   $ ("# دائري. حاوية"). JCarouselLite ({
   السيارات: 4000،
   التمرير: 1،
   السرعة: 800،
   المرئى: 5،
   بداية: 0،
   التعميم: صحيح،
   btnPrev: "# previous_button"،
   btnNext: "# next_button"
   })؛
   })}) (مسج)
   </ SCRIPT>
   </ B: إذا>
   رمز أعلاه يمكنك أيضا وضعه تحت أو فوق قائمة التنقل أو يمكن وضعها على تذييل الصفحة.
8. الخطوة الأخيرة، حفظ القوالب ونرى النتائج. إذا كنت تتبع الخطوات المذكورة أعلاه بشكل صحيح، كاروسيل التمرير وسوف تظهر في بلوق الخاص بك.

فمن السهل نعم، كنت فقط اتبع الخطوات المذكورة أعلاه وتقرأ بعناية لا تتعجل، إذا كان لا يزال هناك غير واضح يرجى ترك رسالة في خانة التعليقات أدناه. وكان هذا البرنامج التعليمي وجيزة حول كيفية جعل دائري السيارات المنزلق حسب الفئة أو علامة هذه المرة، وحسن الحظ ونأمل مفيدة.