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



 
الرئيسيةالرئيسية  س .و .جس .و .ج  الأعضاءالأعضاء  التسجيلالتسجيل  دخولدخول  

شاطر | 
 

 طريقة عمل أيقونة في محرر الكتابه, للردود الجاهزه

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

عدد المساهمات : 354
الأوسمة : المدير

مُساهمةموضوع: طريقة عمل أيقونة في محرر الكتابه, للردود الجاهزه   الخميس سبتمبر 22, 2016 9:51 am

 شرحنا اليوم طريقة إضافة زر في محرر الكتابه, يُمكن الشخص من الضغط عليه لتفتح له قائمه مُنسدله بالردود الجاهزه السريعه.
---------------
النتيجه:



https://i.servimg.com/u/f21/19/14/85/42/aseer10.png
الأن نتوجه الى:
لوحة الاداره >> عناصر إضافيه >> HTML و JAVASCRIPT >> إدارة أكواد Javascript
تفعيل نظام إدارة أكواد Javascript : نعم
إنشاء كود جديد
العنوان * : أي شيء تريد
أضف الكود الى: جميع الصفحات

ثم نضع الكود التالي:



الكود:
$(function() {
  if (!$.sceditor) return;
 
  $.sceditor.command.set('messages', {
    dropDown : function(editor, caller, callback) {
      var messages = {
        'بسم الله...' : 'بسم الله الرحمن الرحيم',
        'السلام...' : 'السلام عليكم ورحمة الله وبركاته',
        'شُكرآ' : 'شُكرآ جزيلا',
        'بارك...' : 'بارك الله فيك',
        'جزاك...' : 'جزاك الله خير',
        'شُكرآ على...' : 'شُكرآ لك على المرور',
        'في رعاية...' : 'في رعاية الله',
'مع السلامه...' : 'مع السلامه'
      },
      a, d = document.createElement('DIV'), i;
 
      for (i in messages) {
        a = document.createElement('A');
        a.className = 'sceditor-font-option';
        a.title = messages[i];
        a.innerHTML = i;
        a.onclick = function() {
          callback(this.title);
          editor.closeDropDown(true);
          return false;
        };
        d.appendChild(a);
      }
 
      editor.createDropDown(caller, 'messages', d);
    },
 
    exec : function(c) {
      var e = this;
      $.sceditor.command.get('messages').dropDown(e, c, function(content) {
        e.insertText(content);
      });
    },
 
    txtExec : function(c) {
      var e = this;
      $.sceditor.command.get('messages').dropDown(e, c, function(content) {
        e.insertText(content);
      });
    },
 
    tooltip : 'Preset messages'
  });
 
  toolbar += '|messages'
});


هناك خيارين لتغيير عنوان الكلمة الظاهره لنا اول مرة, ومن ثم الكلمات التي ستظهر بعد الضغط على الكلمة الأوله..
وللتغيير بإمكانك تعديل:



الكود:
'بسم الله...' : 'بسم الله الرحمن الرحيم',


بحيث بسم الله... هو العنوان.
بسم الله الرحمن الرحيم / هو بعد الضغط على الزر على "بسم الله..."

وغيرها شبيه بالطريقه أعلاه

---------------
الأن نتوجه الى:
لوحة الاداره >> مظهر المنتدى >> الصور والألوان >> ألوان >> ورقة تصميم css







ثم اضف هذا الكود الى ورقة تصميم css


الكود:
.sceditor-dropdown.sceditor-messages {
  height:200px;
  overflow-y:auto;
}
.sceditor-button-messages div {
  background-image:url('http://i21.servimg.com/u/f21/18/42/96/80/edit_p10.gif') !important;
}


لتغيير شكل الأيقونه, عليك بتغيير الرابط التالي:


اقتباس :
https://i.servimg.com/u/f21/18/42/96/80/edit_p10.gif

لا أنصح بالتعديل على الكود الى لذوي الخبره العاليه.
لذوي الخبره القليله: إن أردتم تغيير الألوان أو التصميم عامه, فالمرجوا وضع موضوع في قسم المُساعده وسيتم التعديل.
انتهى الموضوع


طريقة عمل أيقونة في محرر الكتابه, للردود الجاهزه



- لطلب الالتحاق بفريق الأكادمية اضغط هنا.
- ضع شكوى او اقتراح لتطوير اداء الأكادمية.
- لمراسلة الإدارة بامور خاصة اضغط هنا.
الرجوع الى أعلى الصفحة اذهب الى الأسفل
FoFo
الاشراف العام
الاشراف العام
avatar

ذكر
عدد المساهمات : 192
العمر : 20

مُساهمةموضوع: رد: طريقة عمل أيقونة في محرر الكتابه, للردود الجاهزه   الخميس سبتمبر 22, 2016 11:52 am

موضوع رائع شكرا لك



- راجع قوانين القسم قبل فتح موضوع.
- ضع عنوان مناسب يدل على محتوى الموضوع.
يمنع الاشهار في الاقسام الا في قسم الاشهار.
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
طريقة عمل أيقونة في محرر الكتابه, للردود الجاهزه
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

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