|
|
|
|
أدوات الموضوع | انواع عرض الموضوع |
07-13-2013, 11:48 AM | #1 |
مدون جديد
تاريخ التسجيل: Jul 2013
المشاركات: 21
|
اضافه اداه مشاركه اجتماعيه فريده من نوعها الى مدونتك
السلام عليكم ورحمه الله وبركاته كيف حالكم؟ قلت ان اشارككم اليوم اداه جميله جدااا وفريده من نوعها . فاذا قمت بأضافتها فى مدونتك ستقوم بجذب الانتباه كثيرااا للزوار لانها ليست موجوده كثيرااا فى المدونات فأتمنى ان تعجبكم . التركيب نضع هذا الكود فى اداه (HTML/JAVASCRIPT) بعد تغير ما هو باللون الاحمر <div dir="rtl" style="text-align: right;" trbidi="on"> <br /> <style> .RWG-flapwid { font-family:Cambria, Georgia, serif; font-weight:300; font-size:15px; color:#333; overflow-y:hidden; overflow-x:hidden; height:270px; font-smoothing:antialiased; -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; -o-font-smoothing:antialiased; -ms-font-smoothing:antialiased; margin:1px; } .RWG-flapwid a { color:#555; text-decoration:none; } .RWG-bdy { width:600px; position:relative; margin:1px; } .clr { clear:both; height:0; margin:0; padding:0; } .RWG-fgt { list-style:none; display:block; text-align:center; width:100%; margin:5px 0 0; padding:0; } .RWG-fgt:after,.RWG-itm:before { content; display:table; } .RWG-fgt:after { clear:both; } .RWG-fgt li { width:170px; height:170px; display:inline-block; margin:10px; } .RWG-itm { width:100%; height:100%; border-radius:50%; position:relative; cursor:default; -webkit-perspective:900px; -moz-perspective:900px; -o-perspective:900px; -ms-perspective:900px; perspective:900px; } .RWG-tgf { position:absolute; width:100%; height:100%; -webkit-transform-style:preserve-3d; -moz-transform-style:preserve-3d; -o-transform-style:preserve-3d; -ms-transform-style:preserve-3d; transform-style:preserve-3d; } .RWG-tgf > div { display:block; position:absolute; width:100%; height:100%; border-radius:50%; background-position:center center; -webkit-transition:all .4s linear; -moz-transition:all .4s linear; -o-transition:all .4s linear; -ms-transition:all .4s linear; transition:all .4s linear; -webkit-transform-origin:50% 0; -moz-transform-origin:50% 0; -o-transform-origin:50% 0; -ms-transform-origin:50% 0; transform-origin:50% 0; } .RWG-tgf .RWG-tgf-front { box-shadow:inset 0 0 0 10px rgba(0,0,0,0.3); } .RWG-tgf .RWG-tgf-backfb { -webkit-transform:translate3d(0,0,-170px) rotate3d(1,0,0,90deg); -moz-transform:translate3d(0,0,-170px) rotate3d(1,0,0,90deg); -o-transform:translate3d(0,0,-170px) rotate3d(1,0,0,90deg); -ms-transform:translate3d(0,0,-170px) rotate3d(1,0,0,90deg); transform:translate3d(0,0,-170px) rotate3d(1,0,0,90deg); background:#4668af url() center no-repeat; } .RWG-img-2 { background:#de3a26 url() center no-repeat; } .RWG-img-3 { background:#0dace1 url() center no-repeat; } .RWG-tgf h3 { color:#fff; text-transform:uppercase; letter-spacing:0; font-size:24px; height:40px; font-family:'Open Sans', Arial, sans-serif; text-shadow:0 0 1px #fff, 0 1px 2px rgba(0,0,0,0.3); margin:0 20px; padding:40px 0 0; } .RWG-tgf p { color:#fff; font-style:italic; font-size:12px; border-top:1px solid rgba(255,255,255,0.5); margin:10px 0; padding:0; } .RWG-tgf p a { display:block; width:100px; height:30px; background:rgba(0,0,0,0.3); border-radius:2px; color:#fff; font-style:normal; font-weight:700; text-transform:uppercase; text-decoration:none; font-size:9px; letter-spacing:1px; padding-top:3px; font-family:'Open Sans', Arial, sans-serif; text-shadow:0 0 0 #fafafa, 0 0 1px rgba(0,0,0,0.3); -webkit-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -moz-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -o-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -ms-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; transition:transform .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; margin:7px auto 0; } .RWG-tgf p a:hover { background:rgba(0,0,0,0.2); text-shadow:none; -webkit-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -moz-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -o-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; -ms-transition:0 .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; transition:transform .3s ease-in-out .2s opacity .3s ease-in-out .2s background .2s linear 0; } .RWG-itm:hover .RWG-tgf-front { -webkit-transform:translate3d(0,230px,0) rotate3d(1,0,0,-90deg); -moz-transform:translate3d(0,210px,0) rotate3d(1,0,0,-90deg); -o-transform:translate3d(0,210px,0) rotate3d(1,0,0,-90deg); -ms-transform:translate3d(0,210px,0) rotate3d(1,0,0,-90deg); transform:translate3d(0,210px,0) rotate3d(1,0,0,-90deg); opacity:0; } .RWG-itm:hover .RWG-tgf-backfb,.RWG-itm:hover .RWG-tgf-backgp,.RWG-itm:hover .RWG-tgf-backtw { -webkit-transform:rotate3d(1,0,0,0deg); -moz-transform:rotate3d(1,0,0,0deg); -o-transform:rotate3d(1,0,0,0deg); -ms-transform:rotate3d(1,0,0,0deg); transform:rotate3d(1,0,0,0deg); opacity:1; } </style> <br /> <a href="http://www.waseeela.blogspot.com/"></a> <br /> <div class="RWG-flapwid"> <div class="RWG-bdy"> <br /> <section class="main"> <ul class="RWG-fgt"> <li> <div class="RWG-itm"> <div class="RWG-tgf"> <div class="RWG-tgf-front RWG-img-1"> </div> <div class="RWG-tgf-backfb"> <h3> Facebook</h3> Like Our Page <a href="http://facebook.com/waseeela">Like us On Facebook</a></div> </div> </div> </li> <li> <div class="RWG-itm"> <div class="RWG-tgf"> <div class="RWG-tgf-front RWG-img-2"> </div> <div class="RWG-tgf-backgp"> <h3> Google+</h3> Add Us To your Circle<a href="https://plus.google.com/110280613398127301380">Add Us On Google+</a></div> </div> </div> </li> <li> <div class="RWG-itm"> <div class="RWG-tgf"> <div class="RWG-tgf-front RWG-img-3"> </div> <div class="RWG-tgf-backtw"> <h3> Twitter</h3> Join Us on Twitter<a href="http://twitter.com/mohamedtahsen">Follow Us on Twitter</a></div> </div> </div> </li> </ul> </section></div> </div> </div> اتمنا ان تشاركونى فى مدونه وسيله كود:
http://www.waseeela.blogspot.com/
__________________
|
07-16-2013, 01:02 AM | #2 |
مدون جديد
تاريخ التسجيل: Jan 2013
المشاركات: 43
|
رد: اضافه اداه مشاركه اجتماعيه فريده من نوعها الى مدونتك
__________________
|
07-17-2013, 12:07 AM | #3 |
مدون جديد
تاريخ التسجيل: Jul 2013
المشاركات: 15
|
رد: اضافه اداه مشاركه اجتماعيه فريده من نوعها الى مدونتك
__________________
|
07-20-2013, 10:24 PM | #4 |
مدون جديد
تاريخ التسجيل: Jul 2013
الدولة: morocco
المشاركات: 25
|
رد: اضافه اداه مشاركه اجتماعيه فريده من نوعها الى مدونتك
__________________
|
مواقع النشر (المفضلة) |
الكلمات الدلالية (Tags) |
مشاركه, اداه, اجتماعيه, اضافه |
الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1) | |
|
|
المواضيع المتشابهه | ||||
الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
طلب تعديل علي القالب اضافه اداه ترقيم الصفحات | minicheetos | طلبات تعديل القوالب | 0 | 02-19-2013 10:44 PM |
اختفاء بعض مواضيع الصفحه الرئيسيه عند عمل مشاركه جديدة | مصري وافتخر | طلبات تعديل القوالب | 1 | 08-31-2012 07:43 PM |
مشكله عند مشاركه لينك علي الفيسبوك لا تظهر صوره | a7meda1a | طلبات الدعم الفني | 4 | 08-07-2012 02:12 AM |
استفسار بخصوص اضافة مشاركه برابط خارجي [حلت المشكلة] | Moham3d | طلبات الدعم الفني | 3 | 06-14-2012 10:37 AM |
الساعة الآن 01:49 PM - بتوقيت جرينتش
المعهد غير مسؤول عن أي اتفاق تجاري أو
تعاوني بين الأعضاء فعلى كل شخص تحمل مسؤولية نفسه تجاه ما يقوم به من بيع وشراء وإتفاق وإعطاء معلومات مدونته التعليقات المنشورة لا تعبر عن رأي معهد خبراء البلوجر ولا نتحمل أي مسؤولية قانونية حيال ذلك (ويتحمل كاتبها مسؤولية النشر) |