,

 السلام عليكم في هدا الدرس انشاء الله سنتطرق الى طريقة اضافة سلايد شو تلقائي لمدونات بلوجر

صورة للاداة 

1/ نقوم بالدهاب للتخطيط 

2/ الى اضافة  HTML/JavaScript 

3/ نقم باضافة هدا الكود مع تغيير www.3alami7tiiraf.blogspot.com برابط مدونتك او موقعك

<style type="text/css">
#slides *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#slides ul,#slides li{padding:0;margin:0;list-style:none;position:relative}
#slides ul{height:250px}
#slides li{width:49.9%;height:100%;position:absolute;display:none}
#slides li:nth-child(1), #slides li:nth-child(2), #slides li:nth-child(3), #slides li:nth-child(4){display:block}
#slides li:nth-child(1){left:0;top:0}
#slides li:nth-child(2){left:50.1%;width:24.8%;height:49.8%}
#slides li:nth-child(3){left:75.2%;width:24.8%;height:49.8%}
#slides li:nth-child(4){left:50.1%;top:50.2%;height:49.9%}
#slides a{display:block;width:100%;height:100%;overflow:hidden}
#slides img{display:block;width:100%;height:100%;border:0;padding:4px;background-color:#0097BD;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides .overlayx{width:100%;height:100%;position:absolute;z-index:2;background-image:url(http://softglad.at.ua/images/fadebg.png);background-position:50% 50%;background-repeat:repeat-x;border:4px solid #2C3E50;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
#slides h4{position:absolute;bottom:30px;margin:0;font-size:18px;font-family:Arial;left:0;padding:0 10px;color:white;z-index:3;line-height:20px;font-weight:normal}
#slides li:nth-child(2) h4,#slides li:nth-child(3) h4{font-size:13px;line-height:15px}
#slides .label_text{font-size:9px;color:white;bottom:10px;z-index:3;left:10px;font-family:Verdana,Geneva,sans-serif;position:absolute}
#slides li:nth-child(2) .autname,#slides li:nth-child(3) .autname{display:none}
#slides .overlayx,#slides li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
#slides li:hover .overlayx{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}
#buttons{margin: 5px auto;text-align: center;background:#2C3E50;width: 10%;}
#buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}
#buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #E84C3D transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}
#buttons a#nextx::before{border-color:transparent transparent transparent #E84C3D;margin-left:-3px}
@media only screen and (max-width:600px){
  #slides ul{height:600px}
  #slides li:nth-child(1){width:100%;height:49.8%}
  #slides li:nth-child(2){top:50.2%;height:24.8%;left:0;width:49.8%}
  #slides li:nth-child(3){left:50.2%;top:50.2%;width:49.8%;height:24.8%}
  #slides li:nth-child(4){left:0;top:75.3%;height:24.8%;width:100%}
}
</style>
<div id="featuredpost"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://softglad.at.ua/widgets/slider.js" type="text/javascript"></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
FeaturedPost({
blogURL:"http://3alami7tiiraf.blogspot.com/",
MaxPost:8,
idcontaint:"#featuredpost",
ImageSize:300,
interval:5000,
autoplay:true,
tagName:false
});
});
//]]>
</script>


اثمنى ان يكون الشرح جيد . ان واجهتكم اي مشكلة فاتصلوا بنا او
كتابتها في تعليق




, ,

هل أنت مهتم بتنمية معلوماتك في مجالات عديدة؟ وهل ترغب في ذات الوقت الدخول في مواجهة وتحدي للمعلومات مع أشخاص آخرين بشكل مباشر؟  

إذا كانت إجابتك “نعم”.. أنت في المكان الصحيح؛ نقدم لكم الآن لعبة عربية إجتماعية جديدة تحت اسم “المواجهة لعبة المعلومات”.

بعد نجاحها اللافت على منصة ios فقد أعلنت شركة “آلفا ابس” عن إطلاق لعبة المواجهة على منصة الاندرويد ايضًا وبشكل مجاني. بعد تحميل لعبة المواجهة على جهاز الأندرويد سوف يحتاج المستخدم الى تسجيل الدخول الى اللعبة بواسطة حساب الفيس بوك او البريد الإلكتروني ثم سيتمكن من البدء بالمواجهة مع قائمة أصدقاء الفيس بوك او من خلال البحث عن منافسين آخرين متواجدين ضمن التطبيق، وبعد اختيار المنافس يجب عليهم اختيار إحدى الفئات كـ العلوم والتكنولوجيا، الطب، الأديان، الجغرافيا، التاريخ وغيرها من الفئات المتاحة في التطبيق والتي تحتوي على أكثر من 12 ألف سؤال مختلف، حيث تتضمن كل مواجهة 6 جولات يجب على كل متسابق من خلالها اختيار 3 فئات فقط (الأفضل اختيار الفئات الأكثر معرفة بها للتفوق على المنافسين) لكي تبدأ الأسئلة وخيارات الأجوبة بالظهور بشكل دوري لكل متسابق ثم الإجابة عليها خلال وقت محدد حتى تنتهي الجولات الست وتتحدد هوية الفائز في نهاية كل مواجهة وظهور النقاط التي حصلوا عليها مع الإشارة الى إمكانية إجراء الدردشة الكتابية بين المتنافسين خلال المواجهات.

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




طريقة طرح الأسئلة والأجوبةجولات المواجهةالرئيسية - المواجهة
ترتيب الأصدقاء والعالميإضافة أسئلة وأجوبةالدردشة

اللعبة قدمت أكثر من 500,000 مواجهة وأكثر من 110,000 ساعة من اللعب استمتع بها الكثير من المستخدمين في مختلف أنحاء العالم، وهي بالفعل مثال ونموذج للتطبيقات العربية عالية الجودة التي يجب ان يحتذى بها من قِبل المطورين العرب لتصميم وبرمجة التطبيقات والألعاب على منصة اندرويد.

للحصول على اللعبة يمكنكم تحميلها مجانًا من متجر جوجل بلاي عبر الرابط التالي [المواجهة لعبة المعلومات].

الاشتراك في: الرسائل (Atom)

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *

lm7a © جميع الحقوق محفوظة
Powered by v4.1 lam7a

MARI themes

يتم التشغيل بواسطة Blogger.