منتدى يهتم بالنشر والاعلان والتصميم المجاني
 
الرئيسيةالرئيسية  البوابهالبوابه  س .و .جس .و .ج  التسجيلالتسجيل  دخولدخول  







تحت الانشاء

قائمه منتديات



.............. أختر لغة المنتدى من هنا
أختر لغة المنتدى من هنا
1


شاطر | 
 

 كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي

اذهب الى الأسفل 
كاتب الموضوعرسالة
هاجر
المدير
المدير
avatar

نشاطك :
الدوله :
انثى عدد المساهمات : 14
السمعه : 5
تاريخ التسجيل : 31/05/2014

مُساهمةموضوع: رد: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   07.11.14 18:21

هل تابعت طلبي ...
الرجوع الى أعلى الصفحة اذهب الى الأسفل
المدير
المدير
المدير
avatar

نشاطك :
المتصفح :
نوع المنتدى :
الدوله :
انثى عدد المساهمات : 1413
السمعه : 3
تاريخ الميلاد : 01/02/1990
تاريخ التسجيل : 06/12/2012
العمر : 28
الموقع : بغداد
اكتب كلمه من اربع احرف مسرور بلقائكم

مُساهمةموضوع: رد: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   07.11.14 18:23

يوم ويكمل
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://asdd.ahladalil.com
المدير
المدير
المدير
avatar

نشاطك :
المتصفح :
نوع المنتدى :
الدوله :
انثى عدد المساهمات : 1413
السمعه : 3
تاريخ الميلاد : 01/02/1990
تاريخ التسجيل : 06/12/2012
العمر : 28
الموقع : بغداد
اكتب كلمه من اربع احرف مسرور بلقائكم

مُساهمةموضوع: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   05.09.14 15:28



 
وعندما اقول حصريا اعنى انه حصريا كود يسمح لك بمشاهدة المشاركة الاولى للموضوع دون فتح الموضوع اى امكانية ليست متوفرة حتى بالمنتديات المدفوعة
طريقة عمل الاسكربت
يقوم بوضع ايقونة بجوار عنوان الموضوع عند الضغط عليها تظهر نافذة منبثقة تحتوى على الموضوع المشاركة الاولى فقط للموضوع
بشكل رائع وجميل جدا
لا حاجة الى اى صورة توضيحية المثال الحى مايكل سوفت

  



اولا الجافا على جميع الصفحات
الرمز:تحديد_كامل_الكود


الكود:
$(function() {

        // The preview image added after a topic title
        $('a.topictitle').after(' <img id="topicPreview" src="http://hitskin.com/themes/20/23/90/i_icon_latest_reply.png" title="عرض فورى للموضوع" alt="Preview" style="cursor:pointer;" />');
   
        // Once the preview image is clicked
        // we appened the HTML below to the document
        $('img#topicPreview').click(function() {
            $('body').append(
       
                '<div id="preview-filter" style="position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0, 0.5);cursor:pointer;z-index:10;"></div>'+
           
                '<div id="topicPreview-container" style="top:20%;left:15%;right:15%;padding:4px;position:fixed;z-index:50;background:#D1D1D1;border-radius:5px;box-shadow:0px 0px 2px rgba(0,0,0, 0.5) inset;">'+
                    '<style>'+
                        '#closeButton {color:#fff;font-size:10px;font-weight:bold;background:rgba(0,0,0,0.6);box-shadow:0px 0px 2px rgba(0,0,0,1) inset;text-shadow:0px 0px 1px #000;display:inline-block;border-radius:30px;padding:3px 6px;cursor:pointer;position:absolute;top:-8px;right:-8px;}'+
                        '#closeButton:hover {background:#D56262;}'+
                    '</style>'+
                    '<div id="closeButton">اغلاق الصفحة</div>'+
                    '<div id="topicPreviewing" style="max-height:600px;overflow-y:auto;">'+
                        '<center>'+
                            '<span class="topicPreview-loading" style="font-weight:bold;font-size:18px;">'+
                                'انتظر من فضلك'+
                            '</span>'+
                        '</center>'+
                    '</div>'+
                '</div>'
           
            );
       
            // Load the first post of a topic
            $('#topicPreviewing').load(jQuery(this).siblings('a.topictitle').attr('href')+' .post:eq(0)');
       
            // Remove preview on click of the filter
            $('div#preview-filter, #closeButton').click(function() {
              $('#preview-filter, #topicPreview-container').remove();
          });
        });
    });



ثانيا كود CSS لضبط حجم النافذة

الرمز:تحديد_كامل_الكود



الكود:
        #topicPreview-container {
          left:2% !important;
          right:2% !important;
          top:7% !important;
        }
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://asdd.ahladalil.com
فريق الاكواد العربي
المشرف المميز
المشرف المميز
avatar

نشاطك :
المتصفح :
نوع المنتدى :
الدوله :
ذكر عدد المساهمات : 17
السمعه : 0
تاريخ الميلاد : 01/06/1980
تاريخ التسجيل : 17/10/2014
العمر : 38
الموقع : >>>>>>>>>>>>

مُساهمةموضوع: رد: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   12.11.14 8:44

شكرا للموضوع المميز روعه روعه






الرجوع الى أعلى الصفحة اذهب الى الأسفل
المدير
المدير
المدير
avatar

نشاطك :
المتصفح :
نوع المنتدى :
الدوله :
انثى عدد المساهمات : 1413
السمعه : 3
تاريخ الميلاد : 01/02/1990
تاريخ التسجيل : 06/12/2012
العمر : 28
الموقع : بغداد
اكتب كلمه من اربع احرف مسرور بلقائكم

مُساهمةموضوع: رد: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   24.11.14 17:05

كمل الستايل مبرووك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://asdd.ahladalil.com
المدير
المدير
المدير
avatar

نشاطك :
المتصفح :
نوع المنتدى :
الدوله :
انثى عدد المساهمات : 1413
السمعه : 3
تاريخ الميلاد : 01/02/1990
تاريخ التسجيل : 06/12/2012
العمر : 28
الموقع : بغداد
اكتب كلمه من اربع احرف مسرور بلقائكم

مُساهمةموضوع: رد: كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي   30.01.15 17:04

رائع
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://asdd.ahladalil.com
 
كود ايقونه بجنب الموضوع حتا ينفتح الموضوع انبثاقي
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
 :: الاكواد العامه (2) :: اكواد جافا سكربت-
انتقل الى:  
Loading...


دردشه منبثقه



استضافه المنتديات
الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا
الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا
الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا
الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا
الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا الموقع هنا
تواصل اجتماعي منسدله
محترفي البلوجر



ــــــــــــــــ ،، «®°•.¸.•°°•.¸.•°™احمل تصاميمنا على موقع هيت سكن ™°•.¸.•°°•.¸.•°®» !

آلموضوع تصاميمنا على هيت سكن
گآتپ آلموضوع آلقسم آلمشرفين ملآحظآت
جميع ""ما صممناه..على ::هيت""سكن

♣ آخپآر " » آلّ عپق " إدآرة عَپقنآ
منتدياتنا

Icon Icon Icon Icon Follow Me on Pinterest

spice up your blog
:::لطلب كلمه سر جديده من هنا:::