منتدى الابداع العربي

للإبداع لمسات ! ... ولمسـات الإبــداع إختصاصـنا !
 
الرئيسيةالرئيسية  المنشوراتالمنشورات  البوابةالبوابة  التسجيلالتسجيل  دخولدخول  


كود javascript و Css لوضع دردشة في عارضة المنتدى
 

 كود javascript و Css لوضع دردشة في عارضة المنتدى

اذهب الى الأسفل 
كاتب الموضوعرسالة
annex
عضو فعال 

annex

ذكر
عدد المساهمات : 355
نقاط النشاط : 492
السٌّمعَة : 90
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Algeri10
كود javascript و Css  لوضع دردشة في عارضة المنتدى  612

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالسبت مايو 13, 2017 6:15 pm

أقدم لكم اليوم كود javascript و كود CSS لوضوع دردشة في عارضة المنتدى 

هنا سوف تظهر الإضافة 


كود javascript و Css  لوضع دردشة في عارضة المنتدى  Captur25



و عند الضغط تطلع تحت 


كود javascript و Css  لوضع دردشة في عارضة المنتدى  Captur26






الان مع الاكواد  أولا كود JAVASCRIPT

إدارة المنتدى ..... عناصر إضافية ..... إدارة أكواد Javascript .... إضافة كود جديد ( كل الصفحات)




الكود:

(function() {
    if (!window.FA) window.FA = {};
    if (FA.Chat) {
        if (window.console) console.warn('FA.Chat has already been initialized');
        return;
    }
 
    FA.Chat = {
 
        // chatbox settings
        config: {
            height: '60%',
            width: '70%',
 
            live_notif: true,
            sound_notif: {
                enabled: true,
                file: 'https://illiweb.com/fa/fdf/zelda.mono.mp3'
            },
            notifRate: 10000
        },
 
        // language settings
        lang: {
            chatbox: 'Chatbox',
            new_msg: 'Un nouveau message a été posté sur la <a href="javascript:FA.Chat.toggle();">chatbox</a>.'
        },
 
        // technical data below
        node: {}, // node cache
        users: 0, // users in chat
        messages: 'initial', // total chat messages
        actif: false, // tells us if the chatbox is opened
        notifActif: false, // tells us if the notifications are active
 
        // initial setup of the chatbox
        init: function() {
            var right = document.getElementById('fa_right'),
                container = document.createElement('DIV'),
                button = document.createElement('A'),
                audio;
 
            button.id = 'fa_chat_button';
            button.innerHTML = FA.Chat.lang.chatbox + ' <span id="fa_chatters">(0)</span>';
            button.onclick = FA.Chat.toggle;
            FA.Chat.node.button = button;
 
            container.id = 'fa_chat_container';
            container.innerHTML = '<iframe id="fa_chat" src="/chatbox/index.forum"></iframe>';
            container.style.width = FA.Chat.config.width;
            container.style.height = FA.Chat.config.height;
            container.style.bottom = '-' + FA.Chat.config.height;
            container.style.visibility = 'hidden';
 
            if (right) {
                right.insertBefore(button, right.lastChild); // add the chat button to the right side of the toolbar
                document.body.appendChild(container);
 
                // create the notification audio element
                if (FA.Chat.config.sound_notif.enabled) {
                    audio = document.createElement('AUDIO');
                    audio.src = FA.Chat.config.sound_notif.file;
                    if (audio.canPlayType) {
                        FA.Chat.node.audio = audio;
                        document.body.appendChild(audio);
                    }
                }
 
                FA.Chat.node.container = document.getElementById('fa_chat_container');
                FA.Chat.node.chatters = document.getElementById('fa_chatters');
                FA.Chat.node.frame = document.getElementById('fa_chat');
                FA.Chat.node.frame.onload = FA.Chat.getFrame;
            }
 
            delete FA.Chat.init;
        },
 
        // get the frame window, document, and elements
        getFrame: function() {
            if (FA.Chat.poll) window.clearInterval(FA.Chat.poll);
            if (this.contentDocument || this.contentWindow) {
                FA.Chat.window = this.contentWindow;
                FA.Chat.document = this.contentDocument ? this.contentDocument : FA.Chat.window.document;
 
                FA.Chat.node.message = FA.Chat.document.getElementById('message');
                FA.Chat.node.members = FA.Chat.document.getElementById('chatbox_members');
 
                FA.Chat.poll = window.setInterval(FA.Chat.listen, 300); // listen for changes every 0.3 seconds
            }
        },
 
        // listen for changes in the chatbox
        listen: function() {
            var users = FA.Chat.node.members.getElementsByTagName('LI').length,
                messages = FA.Chat.window.chatbox.messages.length;
 
            // update user count
            if (users > FA.Chat.users || users < FA.Chat.users) {
                FA.Chat.users = users;
                FA.Chat.node.chatters.innerHTML = '(' + FA.Chat.users + ')';
            }
 
            // initial / active updates
            if ((FA.Chat.messages == 'initial' && messages) || FA.Chat.notifActif || FA.Chat.actif) FA.Chat.messages = messages;
 
            // notify new messages while connected and the chatbox is closed
            if (!FA.Chat.actif && !FA.Chat.notifActif && FA.Chat.window.chatbox.connected && (messages > FA.Chat.messages || messages < FA.Chat.messages)) {
                FA.Chat.messages = messages; // update message count
                FA.Chat.notifActif = true;
 
                if (FA.Chat.config.live_notif) FA.Chat.notify(FA.Chat.lang.new_msg); // show live notification
                if (FA.Chat.config.sound_notif.enabled && FA.Chat.node.audio) FA.Chat.node.audio.play(); // play sound notification
 
                // wait before notifying the user again
                window.setTimeout(function() {
                    FA.Chat.notifActif = false;
                }, FA.Chat.config.notifRate);
            }
        },
 
        // create a custom notification
        notify: function(msg) {
 
            var notif = document.createElement('DIV'),
                live = document.getElementById(Toolbar.LIVE_NOTIF);
 
            notif.className = 'fa_notification';
            notif.innerHTML = '<div class="content ellipsis">' + msg + '</div>';
            notif.style.display = 'none';
 
            $(notif).mouseover(function() {
                $(this).stop(true, true)
            });
            $(notif).mouseleave(function() {
                $(this).delay(5000).fadeOut()
            });
 
            live.insertBefore(notif, live.firstChild);
            $(notif.firstChild).dotdotdot();
 
            $(notif).fadeIn(100, function() {
                $(this).delay(10000).fadeOut()
            });
        },
 
        // toggle the display state of the chatbox
        toggle: function() {
            var container = FA.Chat.node.container.style;
 
            if (/hidden/i.test(container.visibility)) {
                FA.Chat.node.button.className = 'fa_chat_active';
                FA.Chat.actif = true;
 
                container.visibility = 'visible';
                container.bottom = '3px';
 
                // auto focus the message field
                window.setTimeout(function() {
                    FA.Chat.node.message.focus();
                }, 350); // some browsers ( firefox ) need a delay
            } else {
                FA.Chat.node.button.className = '';
                FA.Chat.actif = false;
 
                container.visibility = 'hidden';
                container.bottom = '-' + FA.Chat.config.height;
            }
        }
 
    };
 
    $(function() {
        // initialize the chat when the document is ready and the user is logged in
        if (_userdata.session_logged_in) $(FA.Chat.init);
    });
})();



ثم نذهب إلى  ورقة CSS و نضيف الكود التالي 


الكود:



    #fa_chat_container {
          background:#FFF;
          border:1px solid #556682;
          border-radius:3px;
          position:fixed;
          right:3px;
          z-index:999;
          overflow:hidden;
          min-width:500px;
          min-height:250px;
          transition:300ms;
        }
       
        #fa_chat {
          border:none;
          width:100%;
          height:100%;
        }
       
        #fa_chat_button {
          color:#FFF;
          line-height:30px;
          margin-left:10px;
          padding:0 5px;
          cursor:pointer;
        }
       
        #fa_chat_button.fa_chat_active {
          color:#333;
          background:#FFF;
        }







و هنيئا لك الإضافة 













3(1)
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.aquarabic.com
JoryAbdallah
سوبر الإبداع 

JoryAbdallah

انثى
السمك
عدد المساهمات : 126400
نقاط النشاط : 142117
السٌّمعَة : 3006
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Saudi-10
العمر : 35

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالسبت مايو 13, 2017 6:44 pm

ماشاء الله تبارك الله
كود جديد ورائع تم تقيمك
واستمر يابطل


كود javascript و Css  لوضع دردشة في عارضة المنتدى  Img_2010
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://taqnyiat.ahlamontada.com/
annex
عضو فعال 

annex

ذكر
عدد المساهمات : 355
نقاط النشاط : 492
السٌّمعَة : 90
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Algeri10
كود javascript و Css  لوضع دردشة في عارضة المنتدى  612

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالسبت مايو 13, 2017 9:23 pm

شكرا على تشجيعك و على مرورك  كود javascript و Css  لوضع دردشة في عارضة المنتدى  1f44d


كود javascript و Css  لوضع دردشة في عارضة المنتدى  1508415341281
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.aquarabic.com
منصورة
سوبر الإبداع 

منصورة

انثى
الدلو
عدد المساهمات : 13970
نقاط النشاط : 16963
السٌّمعَة : 51
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Algeri10
العمر : 58

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالجمعة مايو 19, 2017 12:55 pm

كود مميز اخي annex

الف شكر على الإفادة
تقبل مروري وتقديري


كل القلوب إلى الحبيب تميل
ومعي بهذا شاهد ودليل
اما الدليل إذا ذكرت محمداً
صارت دموع العارفين تسيل
هذا رسول الله نبراس الهدى
هذا لكل العالمين نبيا
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.manssora.com/
K!LLeR
عضو خبير 

K!LLeR

ذكر
عدد المساهمات : 757
نقاط النشاط : 872
السٌّمعَة : 10
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Ioao10

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالخميس أغسطس 03, 2017 4:09 pm

أإسـ عٍ ـد الله أإأوٍقـآتَكُـ بكُـل خَ ـيرٍ دآإئمـاَ تَـبهَـرٍوٍنآآ بَمَ ـوٍآضيعكـ أإلتي تَفُـوٍح مِنهآ عَ ـطرٍ أإلآبدآع وٍأإلـتَمـيُزٍ
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Derraz Boujemaa
عضو ذهبي 

Derraz Boujemaa

ذكر
عدد المساهمات : 3399
نقاط النشاط : 6145
السٌّمعَة : 121
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Morocc10

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالإثنين ديسمبر 11, 2017 3:08 pm

يعطيك العافيه طرح رائع وانت دائما رائع في طرحك .
أنتظر جديدك بكل الشوق والود ,,,
تقبل مروري المتواضع


كود javascript و Css  لوضع دردشة في عارضة المنتدى  OhiHHcI
الرجوع الى أعلى الصفحة اذهب الى الأسفل
Picasso-Des
سوبر الإبداع 

Picasso-Des

ذكر
الجدي
عدد المساهمات : 10775
نقاط النشاط : 11119
السٌّمعَة : 136
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Ioao10
العمر : 37

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالسبت يونيو 16, 2018 11:50 pm

يعطيكم العافية على الطرح كود javascript و Css  لوضع دردشة في عارضة المنتدى  837876428
كل الاحترام كود javascript و Css  لوضع دردشة في عارضة المنتدى  433646733
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://medialive.pro
مصطفى ستيتان
عضو محترف 

مصطفى ستيتان

ذكر
عدد المساهمات : 1130
نقاط النشاط : 1203
السٌّمعَة : 11
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Ioao10

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالثلاثاء يوليو 24, 2018 12:46 pm

 جزاكم الله خيراً  
 كود javascript و Css  لوضع دردشة في عارضة المنتدى  1454454920 كود javascript و Css  لوضع دردشة في عارضة المنتدى  1454454920 كود javascript و Css  لوضع دردشة في عارضة المنتدى  1454454920 


سبحان الله والحمدلله ولا إله إلا الله 
 
كود javascript و Css  لوضع دردشة في عارضة المنتدى  Do
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://www.elmanal.com
Àťéf Hàmmàď
سوبر الإبداع 

Àťéf Hàmmàď

ذكر
عدد المساهمات : 92696
نقاط النشاط : 102560
السٌّمعَة : 708
بلد العضو : كود javascript و Css  لوضع دردشة في عارضة المنتدى  Ioao10

كود javascript و Css  لوضع دردشة في عارضة المنتدى  Empty
مُساهمةموضوع: رد: كود javascript و Css لوضع دردشة في عارضة المنتدى    كود javascript و Css  لوضع دردشة في عارضة المنتدى  Emptyالخميس مايو 14, 2020 10:44 pm

شكرا لك

بوركت ودام عطائك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
كود javascript و Css لوضع دردشة في عارضة المنتدى
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتدى الابداع العربي ::  تقنيات احلى منتدى ::  تقنيات أحلى منتدى :: التقنيات المتقدمة-
انتقل الى:  
جميع الحقوق محفوظة لمنتدى الإبداع العربي 2020