Chakira
11-01-2013, بتوقيت غرينيتش 04:26 PM
http://www.dzbatna.com/images/icons/iconrote.gif ط´ط±ط* ط¹ظ…ظ„ ط³ظ„ط§ظٹط¯ ط´ظˆ ط¨ط§ظ„ظ€ jQuery (http://www.dzbatna.com/t2122592/)
http://www.mtwer.com/ar/wp-content/uploads/13267264592.png
|| - حياكم الله أعضاء وزوار معهد مطور ,, ومرحبا دائما بكم في هذا الصرح المجاني free التطويري ..
|| - نأمل دائما ان نكون عند حسن الظن عند جميع المطورين .. والمحبين للعالم التطويري ..
ونأمل دائما بتقديم أفضل الخدمات في هذا الركن وحصريا على معهد مطور ..
http://www.mtwer.com/ar/wp-content/uploads/DS.png
اخوانى الكرام موعدنا اليوم مع
التطبيق الثانى: وهو شرح طريقة لعمل سلايد شو رائع جدا بال jQuery
http://s19.postimage.org/yan2r000j/08_07_2014_05_23_16.jpg
http://www.mtwer.com/ar/wp-content/uploads/DS.png
مثال على تطبيقنا لليوم
من هنا (http://as.fast-page.org/9/)
ويمكنكم تحمل ملفات التطبيق من المرفقات
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ولنبدأ الشرح طريقة باسم الله الرحمن الرحيم
ملاحظة : السلايد شو الذى نقوم بشرح طريقةه يعتمد اساسا عى مكتبة الجى كويرى الجديدة
jquery.id.chopslider-2.2.0.free.min.js
التى تتضمن التاثيرات والحركات الانتقالية فائقة الجمال كما بالمثال
اولا: تركيب installة html الاساسية
index.html
رمز Code:
<!DOCTYPE html> <html lang="en" > <head> <meta charset="utf-8" /> <title>jQuery Chop Slider</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="author" content="Ahmed swailm" /> <link href="css/layout.css" rel="stylesheet" type="text/css" /> <link href="css/chopslider.css" rel="stylesheet" type="text/css" /> <script src="jquery-1.7.2.min.js"></script> <script src="js/jquery.id.chopslider-2.2.0.free.min.js"></script> <script src="js/jquery.id.cstransitions-1.2.min.js"></script> <script src="js/main.js"></script> </head> <body> <header> <h2>AHMED SWAILM</h2> <a href="http://www.mtwer.com/vb" class="stuts"><span>MTWER.COM/VB</span></a> </header> <div class="container"> <div class="wrapper"> <div class="s-shadow-b"></div> <a id="slide-next" href="#"></a> <a id="slide-prev" href="#"></a> <div id="slider"> <div class="slide cs-activeSlide"> <img src="slide_images/pic1.jpg" width="900" height="300" alt="photo #1" /> </div> <div class="slide"> <img src="slide_images/pic2.jpg" width="900" height="300" alt="photo #2" /> </div> <div class="slide"> <img src="slide_images/pic3.jpg" width="900" height="300" alt="photo #3" /> </div> <div class="slide"> <img src="slide_images/pic4.jpg" width="900" height="300" alt="photo #4" /> </div> <div class="slide"> <img src="slide_images/pic5.jpg" width="900" height="300" alt="photo #5" /> </div> <div class="slide"> <img src="slide_images/pic6.jpg" width="900" height="300" alt="photo #6" /> </div> <div class="slide"> <img src="slide_images/pic7.jpg" width="900" height="300" alt="photo #7" /> </div> </div> <div class="pagination"> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> </div> <div class="slide-descriptions"> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> </div> <div class="caption"></div> </div> </div> </body> </html>
شرح طريقة النقاط الاساسية فى ملف الاندكس
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ملفات الجى كويرى الممعتمد عليه بالسلايد شو
رمز Code:
<script src="jquery-1.7.2.min.js"></script> <script src="js/jquery.id.chopslider-2.2.0.free.min.js"></script> <script src="js/jquery.id.cstransitions-1.2.min.js"></script> <script src="js/main.js"></script>
الصور المستخدمة فى العرض وهى موجودة فى مجلد slide_images
رمز Code:
<div id="slider"> <div class="slide cs-activeSlide"> <img src="slide_images/pic1.jpg" width="900" height="300" alt="photo #1" /> </div> <div class="slide"> <img src="slide_images/pic2.jpg" width="900" height="300" alt="photo #2" /> </div> <div class="slide"> <img src="slide_images/pic3.jpg" width="900" height="300" alt="photo #3" /> </div> <div class="slide"> <img src="slide_images/pic4.jpg" width="900" height="300" alt="photo #4" /> </div> <div class="slide"> <img src="slide_images/pic5.jpg" width="900" height="300" alt="photo #5" /> </div> <div class="slide"> <img src="slide_images/pic6.jpg" width="900" height="300" alt="photo #6" /> </div> <div class="slide"> <img src="slide_images/pic7.jpg" width="900" height="300" alt="photo #7" /> </div> </div>
التعليقات على الصور
رمز Code:
<div class="slide-descriptions"> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> </div>
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ثانيا : ملف css3
css/layout.css and css/chopslider.css
رمز Code:
/*---------- ملاحظة : هذا الملف ليس قرءانا منزل اعنى اظهر ابداعك وطور فيه كم تريد ----------- */ @charset "utf-8"; p { margin:10px 0; } h1, h2, h3, h4, h5, h6 { margin:0 0 10px; } h5 { text-transform:uppercase; } img { border:none; } a { text-decoration:underline; color:#3c0d0d; outline:none; } h2 { margin:15px 0; } ul li { margin:5px 0; } .wrapper { position:relative; margin-left:auto; margin-right:auto; width:960px; height:300px; display:block; padding-top:150px; padding-bottom:120px; background:url(../images/podium.png) no-repeat bottom; z-index:2; } .wrapper2 { position:relative; margin-left:auto; margin-right:auto; margin-top:20px; width:960px; height:300px; display:block; z-index:2; text-align:center; padding-bottom:50px; } .wrapper2 a { display:inline-block; padding:0px 5px; background:#fff; border:1px solid #ccc; border-radius:3px; text-decoration:none; margin:0px 5px; } .wrapper2 .active-transition { background:#222; color:#fff; } /*---------- Slider ----------- */ /*---------- اعدادات اسهم التمرير لليسار ولليمين ----------- */ #slide-prev { position:absolute; width:21px; height:33px; bottom:39px; left:26px; z-index:4; background:url(../images/sl-control.png) left top no-repeat; } #slide-next { position:absolute; width:21px; height:33px; bottom:39px; right:26px; z-index:4; background:url(../images/sl-control.png) left bottom no-repeat; } /*---------- الظلال : من اجل جمال العرض فقط ----------- */ .s-shadow-b{ background:url(../images/shadow.png) no-repeat top; width:876px; height:55px; position:absolute; left:42px; bottom:60px; z-index:1; } /*---------- اعدادات الكونتينير الاصلى : مساحة العرض----------- */ #slider { width:900px; height:300px; margin-left:auto; margin-right:auto; position:relative; z-index:2; display:block; } /* كل الشرائح يجب ان تكون مخفية افتراضيا */ .slide { display:none; } /* ووحدها الشريحة الحامله للكلاس "cs-activeSlide" هى التى نكون ظاهرة !Reserved Class name. Required class! */ .cs-activeSlide { display:block; } /* التسمية التوضيحية للصور يحب ان تكون مخفية افتراضيا ايضا */ .slide-descriptions { display:none; } /* مساحة العرض مع شرح طريقة، يجب أن تكون مخفية بشكل افتراضي */ .caption { background: url("../images/d-bg.png") repeat scroll 0 0 transparent; color: #FFFFFF; display: none; height: 280px; padding: 20px; position: absolute; right: 40px; top: 140px; width: 180px; z-index: 3; } .full-3D { right: 40px; top: 580px; width: 840px; height:20px; } /* مساحة العرض وازرار التقسيم */ .pagination { bottom: 50px; left: 345px; margin-top: 50px; position: absolute; text-align: center; } .slider-pagination { display:inline-block; width:15px; height:10px; background:url(../images/navi.png) no-repeat left bottom; margin:0 10px; cursor:pointer; position:relative; z-index:200; } /* خذا هو المطلو للشريحة التى تحمل فئة نشيط "Active" ! Reserved Class Name ! */ .cs-active-pagination { background:url(../images/navi.png) no-repeat left top; } /* الشرائح المتتعددة */ .slider-2 { padding-top:0; margin-top:20px; } #slider-1, #slider-2 { width:900px; height:300px; margin-left:auto; margin-right:auto; position:relative; z-index:2; display:block; } .cs-activeSlide-2 { display:block } .cs-active-pagination-2 { background:url(../images/navi.png) no-repeat left top; } /* ---- AHMED SWAILM ,---MTWER.COM ...*/
اخوانى الكرام المتابعين تم شرح طريقة ملف CSS بالتقصيل فقرة فقرة داخل الملف
وارجوا الا يكون فى الامر اى غموض
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ثالثا : ملفات JQuery
لدينا اضافتان او مكتبتان للجى كويرى تم ادراجهما بالعمل وهما
js/jquery.id.chopslider-2.2.0.free.min.js
js/jquery.id.cstransitions-1.2.min.js
والملف الثالث وهو
js/main.js
يحتوى على الاوامر التى نستخدمها من كلا المكتبتين السابقتين
كما يلى :
رمز Code:
[HTML]jQuery(function(){ $("#slider").chopSlider({ /* عناصر الشرائح */ slide : ".slide", /* الكونتينير او مساحة العرض */ nextTrigger : "a#slide-next", prevTrigger : "a#slide-prev", hideTriggers : true, sliderPagination : ".slider-pagination", /* التعليقات او الشرح طريقة على الصور */ useCaptions : true, everyCaptionIn : ".sl-descr", showCaptionIn : ".caption", captionTransform : "scale(0) translate(-600px,0px) rotate(45deg)", /* التشغيل التلقائى -autoplay */ autoplay : true, autoplayDelay : 5000, /* للمتصفحات التى تدعم الحركة الانتقالية ثلاثية الابعاد */ t3D : csTransitions['3DFlips']['random'], t2D : [ csTransitions['multi']['random'], csTransitions['vertical']['random'] ], noCSS3 : csTransitions['noCSS3']['random'], mobile : csTransitions['mobile']['random'], onStart: function(){}, onEnd: function(){} }) })
وارجوا ان شاء الله يكون مفهوم مضمون كود code الجى كويرى السابق
http://www.mtwer.com/ar/wp-content/uploads/DS.png
اخوانى الكرام اعضاء مطور وزاورة الى هنا ينتهى هذا التطبيق
وتبقى دورتنا ودروسنا مستمرة ان شاء الله تعالى
وانا حاضر لاى سؤال او استفسار
وأتمنى وضعه هنا
التطبيق الثانى : شرح طريقة عمل سلايد شو بال jQuery - مطور Mtwer (http://www.mtwer.com/vb/t107578.html)
شكرا لكل من ساهم فى هذة الدورة ولو معنويا
شكرا لكم وانتظرونا فى معهد الحصريات : مطور
ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
http://www.mtwer.com/ar/wp-content/uploads/13267264592.png
|| - حياكم الله أعضاء وزوار معهد مطور ,, ومرحبا دائما بكم في هذا الصرح المجاني free التطويري ..
|| - نأمل دائما ان نكون عند حسن الظن عند جميع المطورين .. والمحبين للعالم التطويري ..
ونأمل دائما بتقديم أفضل الخدمات في هذا الركن وحصريا على معهد مطور ..
http://www.mtwer.com/ar/wp-content/uploads/DS.png
اخوانى الكرام موعدنا اليوم مع
التطبيق الثانى: وهو شرح طريقة لعمل سلايد شو رائع جدا بال jQuery
http://s19.postimage.org/yan2r000j/08_07_2014_05_23_16.jpg
http://www.mtwer.com/ar/wp-content/uploads/DS.png
مثال على تطبيقنا لليوم
من هنا (http://as.fast-page.org/9/)
ويمكنكم تحمل ملفات التطبيق من المرفقات
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ولنبدأ الشرح طريقة باسم الله الرحمن الرحيم
ملاحظة : السلايد شو الذى نقوم بشرح طريقةه يعتمد اساسا عى مكتبة الجى كويرى الجديدة
jquery.id.chopslider-2.2.0.free.min.js
التى تتضمن التاثيرات والحركات الانتقالية فائقة الجمال كما بالمثال
اولا: تركيب installة html الاساسية
index.html
رمز Code:
<!DOCTYPE html> <html lang="en" > <head> <meta charset="utf-8" /> <title>jQuery Chop Slider</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="author" content="Ahmed swailm" /> <link href="css/layout.css" rel="stylesheet" type="text/css" /> <link href="css/chopslider.css" rel="stylesheet" type="text/css" /> <script src="jquery-1.7.2.min.js"></script> <script src="js/jquery.id.chopslider-2.2.0.free.min.js"></script> <script src="js/jquery.id.cstransitions-1.2.min.js"></script> <script src="js/main.js"></script> </head> <body> <header> <h2>AHMED SWAILM</h2> <a href="http://www.mtwer.com/vb" class="stuts"><span>MTWER.COM/VB</span></a> </header> <div class="container"> <div class="wrapper"> <div class="s-shadow-b"></div> <a id="slide-next" href="#"></a> <a id="slide-prev" href="#"></a> <div id="slider"> <div class="slide cs-activeSlide"> <img src="slide_images/pic1.jpg" width="900" height="300" alt="photo #1" /> </div> <div class="slide"> <img src="slide_images/pic2.jpg" width="900" height="300" alt="photo #2" /> </div> <div class="slide"> <img src="slide_images/pic3.jpg" width="900" height="300" alt="photo #3" /> </div> <div class="slide"> <img src="slide_images/pic4.jpg" width="900" height="300" alt="photo #4" /> </div> <div class="slide"> <img src="slide_images/pic5.jpg" width="900" height="300" alt="photo #5" /> </div> <div class="slide"> <img src="slide_images/pic6.jpg" width="900" height="300" alt="photo #6" /> </div> <div class="slide"> <img src="slide_images/pic7.jpg" width="900" height="300" alt="photo #7" /> </div> </div> <div class="pagination"> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> <span class="slider-pagination"></span> </div> <div class="slide-descriptions"> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> </div> <div class="caption"></div> </div> </div> </body> </html>
شرح طريقة النقاط الاساسية فى ملف الاندكس
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ملفات الجى كويرى الممعتمد عليه بالسلايد شو
رمز Code:
<script src="jquery-1.7.2.min.js"></script> <script src="js/jquery.id.chopslider-2.2.0.free.min.js"></script> <script src="js/jquery.id.cstransitions-1.2.min.js"></script> <script src="js/main.js"></script>
الصور المستخدمة فى العرض وهى موجودة فى مجلد slide_images
رمز Code:
<div id="slider"> <div class="slide cs-activeSlide"> <img src="slide_images/pic1.jpg" width="900" height="300" alt="photo #1" /> </div> <div class="slide"> <img src="slide_images/pic2.jpg" width="900" height="300" alt="photo #2" /> </div> <div class="slide"> <img src="slide_images/pic3.jpg" width="900" height="300" alt="photo #3" /> </div> <div class="slide"> <img src="slide_images/pic4.jpg" width="900" height="300" alt="photo #4" /> </div> <div class="slide"> <img src="slide_images/pic5.jpg" width="900" height="300" alt="photo #5" /> </div> <div class="slide"> <img src="slide_images/pic6.jpg" width="900" height="300" alt="photo #6" /> </div> <div class="slide"> <img src="slide_images/pic7.jpg" width="900" height="300" alt="photo #7" /> </div> </div>
التعليقات على الصور
رمز Code:
<div class="slide-descriptions"> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> <div class="sl-descr">comment on the image</div> </div>
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ثانيا : ملف css3
css/layout.css and css/chopslider.css
رمز Code:
/*---------- ملاحظة : هذا الملف ليس قرءانا منزل اعنى اظهر ابداعك وطور فيه كم تريد ----------- */ @charset "utf-8"; p { margin:10px 0; } h1, h2, h3, h4, h5, h6 { margin:0 0 10px; } h5 { text-transform:uppercase; } img { border:none; } a { text-decoration:underline; color:#3c0d0d; outline:none; } h2 { margin:15px 0; } ul li { margin:5px 0; } .wrapper { position:relative; margin-left:auto; margin-right:auto; width:960px; height:300px; display:block; padding-top:150px; padding-bottom:120px; background:url(../images/podium.png) no-repeat bottom; z-index:2; } .wrapper2 { position:relative; margin-left:auto; margin-right:auto; margin-top:20px; width:960px; height:300px; display:block; z-index:2; text-align:center; padding-bottom:50px; } .wrapper2 a { display:inline-block; padding:0px 5px; background:#fff; border:1px solid #ccc; border-radius:3px; text-decoration:none; margin:0px 5px; } .wrapper2 .active-transition { background:#222; color:#fff; } /*---------- Slider ----------- */ /*---------- اعدادات اسهم التمرير لليسار ولليمين ----------- */ #slide-prev { position:absolute; width:21px; height:33px; bottom:39px; left:26px; z-index:4; background:url(../images/sl-control.png) left top no-repeat; } #slide-next { position:absolute; width:21px; height:33px; bottom:39px; right:26px; z-index:4; background:url(../images/sl-control.png) left bottom no-repeat; } /*---------- الظلال : من اجل جمال العرض فقط ----------- */ .s-shadow-b{ background:url(../images/shadow.png) no-repeat top; width:876px; height:55px; position:absolute; left:42px; bottom:60px; z-index:1; } /*---------- اعدادات الكونتينير الاصلى : مساحة العرض----------- */ #slider { width:900px; height:300px; margin-left:auto; margin-right:auto; position:relative; z-index:2; display:block; } /* كل الشرائح يجب ان تكون مخفية افتراضيا */ .slide { display:none; } /* ووحدها الشريحة الحامله للكلاس "cs-activeSlide" هى التى نكون ظاهرة !Reserved Class name. Required class! */ .cs-activeSlide { display:block; } /* التسمية التوضيحية للصور يحب ان تكون مخفية افتراضيا ايضا */ .slide-descriptions { display:none; } /* مساحة العرض مع شرح طريقة، يجب أن تكون مخفية بشكل افتراضي */ .caption { background: url("../images/d-bg.png") repeat scroll 0 0 transparent; color: #FFFFFF; display: none; height: 280px; padding: 20px; position: absolute; right: 40px; top: 140px; width: 180px; z-index: 3; } .full-3D { right: 40px; top: 580px; width: 840px; height:20px; } /* مساحة العرض وازرار التقسيم */ .pagination { bottom: 50px; left: 345px; margin-top: 50px; position: absolute; text-align: center; } .slider-pagination { display:inline-block; width:15px; height:10px; background:url(../images/navi.png) no-repeat left bottom; margin:0 10px; cursor:pointer; position:relative; z-index:200; } /* خذا هو المطلو للشريحة التى تحمل فئة نشيط "Active" ! Reserved Class Name ! */ .cs-active-pagination { background:url(../images/navi.png) no-repeat left top; } /* الشرائح المتتعددة */ .slider-2 { padding-top:0; margin-top:20px; } #slider-1, #slider-2 { width:900px; height:300px; margin-left:auto; margin-right:auto; position:relative; z-index:2; display:block; } .cs-activeSlide-2 { display:block } .cs-active-pagination-2 { background:url(../images/navi.png) no-repeat left top; } /* ---- AHMED SWAILM ,---MTWER.COM ...*/
اخوانى الكرام المتابعين تم شرح طريقة ملف CSS بالتقصيل فقرة فقرة داخل الملف
وارجوا الا يكون فى الامر اى غموض
http://www.mtwer.com/ar/wp-content/uploads/DS.png
ثالثا : ملفات JQuery
لدينا اضافتان او مكتبتان للجى كويرى تم ادراجهما بالعمل وهما
js/jquery.id.chopslider-2.2.0.free.min.js
js/jquery.id.cstransitions-1.2.min.js
والملف الثالث وهو
js/main.js
يحتوى على الاوامر التى نستخدمها من كلا المكتبتين السابقتين
كما يلى :
رمز Code:
[HTML]jQuery(function(){ $("#slider").chopSlider({ /* عناصر الشرائح */ slide : ".slide", /* الكونتينير او مساحة العرض */ nextTrigger : "a#slide-next", prevTrigger : "a#slide-prev", hideTriggers : true, sliderPagination : ".slider-pagination", /* التعليقات او الشرح طريقة على الصور */ useCaptions : true, everyCaptionIn : ".sl-descr", showCaptionIn : ".caption", captionTransform : "scale(0) translate(-600px,0px) rotate(45deg)", /* التشغيل التلقائى -autoplay */ autoplay : true, autoplayDelay : 5000, /* للمتصفحات التى تدعم الحركة الانتقالية ثلاثية الابعاد */ t3D : csTransitions['3DFlips']['random'], t2D : [ csTransitions['multi']['random'], csTransitions['vertical']['random'] ], noCSS3 : csTransitions['noCSS3']['random'], mobile : csTransitions['mobile']['random'], onStart: function(){}, onEnd: function(){} }) })
وارجوا ان شاء الله يكون مفهوم مضمون كود code الجى كويرى السابق
http://www.mtwer.com/ar/wp-content/uploads/DS.png
اخوانى الكرام اعضاء مطور وزاورة الى هنا ينتهى هذا التطبيق
وتبقى دورتنا ودروسنا مستمرة ان شاء الله تعالى
وانا حاضر لاى سؤال او استفسار
وأتمنى وضعه هنا
التطبيق الثانى : شرح طريقة عمل سلايد شو بال jQuery - مطور Mtwer (http://www.mtwer.com/vb/t107578.html)
شكرا لكل من ساهم فى هذة الدورة ولو معنويا
شكرا لكم وانتظرونا فى معهد الحصريات : مطور
ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
